web-dev-qa-db-ja.com

jQueryのぼかしとEnterキー

入力されている郵便番号に基づいて、Googleマップでdivを動的に更新しようとしています。ユーザーがタブで入力ボックス(id ZipCode)から離れると正常に機能しますが、Enterキーを押してもフィールドがぼやけることはありません。 onkeyupでの動作にはバリエーションがありますが、一方のイベントがもう一方のイベントを呼び出し、その混乱を招きます。いずれかのイベントが発生した場合、機能を開始することは可能ですか?.

 $(document).ready(function(){
 $( "#ZipCode")。blur(function(){
 $( "#dynamic")。load( 'googlemap.php'、{zipcode:$( '#ZipCode')。val()、maxdistance:$( "input [name = 'MaxDistance']:checked")。val()}、
関数(){
}); 
}); 
}); 

ポインタをありがとう。

20
Jon Harris

あなたはこれを行うことができます:

 $(document).ready(function() {    
     $("#ZipCode").bind('blur keyup',function(e) {  
          if (e.type === 'blur' || e.keyCode === 13)  
          // do your stuff here  
     });  
  });

構文:event.keyCode
戻り値:Unicode文字コードまたはUnicodeキーコードのいずれかを表す数値。

26
Town

あなたはこれを行うことができます:

$(document).ready(function() {
$("#ZipCode").bind('blur keyup', function(e) {
    if(e.type === 'keyup' && e.keyCode !== 10 && e.keyCode !== 13) return;
    $("#dynamic").load('googlemap.php', {zipcode: $('#ZipCode').val(), maxdistance:  $("input[name='MaxDistance']:checked").val() }, 
        function() {
        });
    });
}) ;
12

あなたの質問を読み直した後、あなたがしたいことは、テキストボックス(つまり、#ZipCode)ぼやけている場合は、googlemap要素を更新してください。 Enterキーが押されたら、テキストボックスをぼかします。これにより、googlemap要素が更新されます。

あなたが言及したコメントの中で、Enterキーでフォームを送信したくないとのことです。 keypressイベントも処理する必要がある場合があります。

$(document).ready(function() {
    $("#ZipCode").blur(function() {
        $("#dynamic").load('googlemap.php', {zipcode: $('#ZipCode').val(), maxdistance:  $("input[name='MaxDistance']:checked").val() }, 
            function() {
        });
    });

    $("#ZipCode").keyup(function(e) {
        if (e.which == 13) // Enter key
            $(this).blur();
    });

    // prevent the Enter key from submitting the form
    $('#ZipCode').keypress(function(e) { return e.which != 13; });
}) ;
11
William Niu

1つのイベントのみが発生することを許可します。イベントblurkeypressの両方で目的の関数を呼び出すことができます。最後に、実際の関数または目的の関数をぼかしイベントで呼び出す必要があります。例
<input disabled="true" type="text" placeholder="Enter Start Location" id = "fromPlaceEntry" onkeypress="startHandlingFromSubmission(event)" onblur="startHandlingFromSubmission(event)">
次の方法でstartHandlingFromSubmission()関数を呼び出すことができます。

function startHandlingFromSubmission(e){
if(e.keyCode===13){ //To check enter event  
    $(e.target).blur();
}
if(e.keyCode===0){ //To check span event
    setTimeout(function() {
        handleFromPlaceSubmission(e);
    }, 200);
}
}

function handleFromPlaceSubmission(e){

        //This is the actual function which we desire to call
       if(e.keyCode === 0){ //executing only in case of blur event
       // your code goes here
       }
}
0
Apoorv Nag