ユーザーがページを読み込まずに入力ボックスに入力したときにajax()を呼び出そうとしていますが、ユーザーが入力ボックスに入力したときにこのajaxメソッドを呼び出しています。私の入力ボックスは次のとおりです:
<input type="text" name="search" id="txt_name" placeholder="Keyword"/>
Jquery./Ajaxコード;
$(document).ready(function(){
$("#txt_name").keyup(function(){
var value = $('#txt_name').val();
$.ajax({
type:"post",
url:"doSearchEnter.php",
data :{
'key' : value
},
success:function(res){
$('#showSearchResult').html(res);
}
});
});
});
ユーザーがページを読み込まずに入力ボックスに入力した後、このajax()を呼び出すにはどうすればよいですか?
更新:
$('#txt_name').on('click', 'submit', function(e) {
e.preventDefault();
$.ajax({
type:"post",
url:"doSearchEnter.php",
data :{
'key' : value
},
success:function(res){
$('#showSearchResult').html(res);
}
});
});
アップデート2:
<form>
<input type="button" name="given_name" value="Given Name" class="search_submit" id="given_name"/>
<input type="button" name="company_name" value="Company Name" class="search_submit" id="company_name"/>
<input type="button" name="cdid" value="ID" class="search_submit" id="cdid"/>
<input type="text" name="search" id="txt_name" placeholder="Keyword"/>
</form>
$('form').on('click', 'submit', function(e){
e.preventDefault();
});
$('form').on('keyup', '#txt_name', function(e){
if(e.keyCode == '13'){
$.ajax({
type:"post",
url:"doSearchEnter.php",
data :{
'key' : value
},
success:function(res){
$('#showSearchResult').html(res);
}
});
}
});
送信ボタンを使用してフォーム内に入力を配置すると、うまくいくはずです。ユーザーがEnterキーを押すと、フォームが送信されます。あなたがしなければならないのは使用することだけです
$('form').on('click', 'submit', function(e) {
e.preventDefault();
$.ajax({
//do your Ajax thing here
});
});
更新:3つのフォームでは、3つすべてに同じAjax呼び出しを使用し、そのようにデータをまとめます。
var formData = $(this).closest('form').serialize();
$.ajax({
type: 'POST',
url: 'test.php',
data: formData
});
これにより、jqueryは、フォームデータをサーバー側スクリプトに渡すための適切な形式で配置するように指示され、3つのスクリプトすべてで機能します。
UPDATE2:更新された質問に基づく更新:
$('form').on('submit', function(e){
e.preventDefault();
});
$('form').on('keyup', '#txt_name', function(e){
if(e.keyCode == '13'){
$.ajax({
//do Ajax stuff
});
}
});
ここに作業コードへのリンクがあります!jsfiddle
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加