2017-05-30 9 views
-1

テキストボックスのテキストをnullに変更するjQuery関数を作成し、ボタンのonClickイベントに渡しました。JQuery関数がテキストボックスの値を変更しない

$(function ResetForm() { 
 
    $('#TxtFName').val(""); 
 
    $('#TxtLName').val(""); 
 
    $('#TxtSalary').val(""); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <form action="/Employee/SaveEmployee" method="post"> 
 
    First Name: <input type="text" id="TxtFName" name="FirstName" value="" /> <br/> Last Name: <input type="text" id="TxtLName" name="LastName" value="" /> <br /> Salary: <input type="text" id="TxtSalary" name="Salary" value="" /> <br />

姓と給与が変化していない最初の名前のテキスト値。誰かが私を助けることができますか?

答えて

0

この動作をボタンクリックイベントに渡す場合は、これを暗黙的にボタンクリックイベントと結び付けてみてください。

$("#targetButton").click(function() { 
    $('#TxtFName').val(""); 
    $('#TxtLName').val(""); 
    $('#TxtSalary').val(""); 
}); 
+0

を使用することができますが、なぜのonclickイベントでの関数呼び出しでそれを行うカント? –

0

あなたは値が他のファイルでは、デフォルトでは常に空になることを受信する場合のため、その機能を必要とし、各入力フィールドにvalue=""を入れていけないいけません。

$('#reset').click(function(){ 
 
     $(this).closest('form').find("#TxtFName, #TxtLName, #TxtSalary").val(""); 
 
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <form action="/Employee/SaveEmployee" method="post" id="form1"> 
 
     First Name: <input type="text" id="TxtFName" name="FirstName"/> <br/> 
 
     Last Name: <input type="text" id="TxtLName" name="LastName" /> <br /> 
 
     Salary: <input type="text" id="TxtSalary" name="Salary" /> <br /> 
 
     <button type="button" id="reset">Reset</button> 
 
     </form> </div>

+0

私はあなたの答えを得た。私はこのjavascriptをjqueryに変換しようとしていました。

+0

ありがとうございます。だから、コード化された方法が間違っている? jqueryで関数を書くときはいつもイベントを呼び出す必要がありますか?どのように私はonclickイベントでそれを行うことができますか? –

+0

はい、それは間違っていましたが、あなたはクリック機能を備えた関数を呼び出していました。 – SilverSurfer

0

フォームの後に火は、私はあなたが以下のような何かしたいと思いコード

0

上に置く機能で

 $('form').trigger('reset'); 

を提出することを一つの関数を作成することができます。

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

<script> 

function myFunction() 
{ 
     $("#TxtFName").val(""); 
     $('#TxtLName').val(""); 
     $('#TxtSalary').val(""); 
} 

</script> 

</head> 
<body> 
<form> 
    First Name: <input type="text" id="TxtFName" name="FirstName" value="" /> <br/> 
    Last Name: <input type="text" id="TxtLName" name="LastName" value="" /> <br /> 
    Salary: <input type="text" id="TxtSalary" name="Salary" value="" /> <br /> 
    <button onclick="myFunction()">Reset</button> 
<form> 
</body> 
</html> 
+0

よろしくお願いします。 :)) –

0

あなたは、このボタントリガー

<form action="/Employee/SaveEmployee" method="post" id="form1"> 
      First Name: <input type="text" id="TxtFName" name="FirstName"/> <br/> 
      Last Name: <input type="text" id="TxtLName" name="LastName" /> <br /> 
      Salary: <input type="text" id="TxtSalary" name="Salary" /> <br /> 
      <button type="button" id="reset">Reset</button> 
      </form> </div> 

$('#reset').click(function(){ 
$('#form1').trigger('reset'); 
    }); 
関連する問題