jquery輸入/按鍵不工作

我想創建一個簡單的搜索框，允許您根據您在輸入字段中輸入的關鍵字進行搜索。如果按下「提交」按鈕，此工作正常。jquery輸入/按鍵不工作

我也想能夠按回車鍵或Return鍵開始搜索。我試過使用.on函數，它似乎只能用於點擊，但在輸入或按鍵時沒有成功。任何有識之士將不勝感激！

$(document).ready(function() { 

    //$("#gallery").empty();       
    $("#submit").on("click keypress",function (e) { 
       console.log($(this).text()); 
       console.log("e.which " +e.which); 
       console.log("e.type " +e.type); 

      if (e.which === 13 || e.type === 'click') {  
       if($("#term").val() !=""){ 
       //$("#gallery").empty();  
       /**********************/ 
       updatestatus(); 
       ajaxProcess(); 
       /**************************/  
       }else { 
        //$("#gallery").text("Please enter a keyword to search").fadeOut(2500); 
        alert("Please enter a keyword to search"); 
       } 
      } 
    }); 

    $("#clear").click(function(){ 
      $("#gallery").empty();     
    }); 

});

HTML

<form> 
<input type="text" value="" id="term" /> 
<input id="submit" type="button" value="Go"> 
<input type="reset" id="clear" value="Clear" /> 
</form>

來源

2015-04-05 user244394

那麼你擊中'＃submit'按鈕進入，或者在'＃term'輸入？您應該可以將一個事件綁定到每個元素。 – adeneo 2015-04-05 16:59:58

甚至更好，將事件附加到submit'事件的表單，並且它會自動工作 – adeneo 2015-04-05 17:00:26

@ user244394我已經展示了將表單提交以及綁定按鍵事件同時輸入到文本框的示例。檢查我的回答 – mohamedrias 2015-04-05 17:15:24

你只綁定事件處理程序#submit元素。但是按鍵事件不是在那個元素上提出的。

相反，你必須綁定到文檔：

$(document).keypress(function(e) { 
    switch (e.keyCode) { 
     case 13: // RETURN 
      ... 
    } 
}

在處理函數，那麼你可以檢查哪個鍵被按下，並採取行動。

來源

2015-04-05 17:00:38 arkascha

綁定一個onsubmit事件處理程序的形式。因此，當您在輸入文本中點擊enter鍵時，表單提交將觸發將執行您的ajax調用。

$("#submit").on("click keypress",function (e) { 
 
     
 
      if($("#term").val() !=""){ 
 
      /* 
 
      updatestatus(); 
 
      ajaxProcess(); 
 
      */ 
 
      }else { 
 
       alert("Please enter a keyword to search"); 
 
      } 
 
}); 
 

 
$("#clear").click(function(){ 
 
    $("#gallery").empty();     
 
}); 
 

 
    $("form").submit(function(e){ 
 
       $("#submit").trigger('click'); 
 
});

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

 
<form> 
 
<input type="text" value="" id="term" /> 
 
<input id="submit" type="button" value="Go"> 
 
<input type="reset" id="clear" value="Clear" /> 
 
</form>

或綁定keypress事件到input文本框和檢查event.which==13檢查，如果其進入關鍵並做處理。

$("#submit").on("click keypress",function (e) { 
 
     
 
      if($("#term").val() !=""){ 
 
      /* 
 
      updatestatus(); 
 
      ajaxProcess(); 
 
      */ 
 
      }else { 
 
       alert("Please enter a keyword to search"); 
 
      } 
 
}); 
 

 
$("#clear").click(function(){ 
 
     $("#gallery").empty();     
 
}); 
 

 
    $("input#term").on("keypress", function(e){ 
 
    if (e.which === 13) { 
 
     $("#submit").trigger('click'); 
 
    } 
 
    });

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

 
<form> 
 
<input type="text" value="" id="term" /> 
 
<input id="submit" type="button" value="Go"> 
 
<input type="reset" id="clear" value="Clear" /> 
 
</form>

來源

2015-04-05 17:03:35 mohamedrias

綁定事件到表單輸入字段它的自我：

$(document).ready(function() { 

    $("#submit").on("click",function() { 
     // After submit stuff: 
     updatestatus(); 
     ajaxProcess(); 
    }); 

    $("form input").keypress(function(e){ 
     if (e.which === 13) { 
      $("#submit").trigger('click'); 
     } 
    }); 

});

來源

2015-04-05 17:04:22

您的代碼idoes火兩個事件「點擊」和「按鍵」，但這裏的漁獲您是否已經使用提交按鈕綁定了「按鍵」事件，該按鈕只會觸發輸入按鈕而不是字符或數字鍵，因此您需要將按鍵綁定到輸入類型或文檔本身來執行操作，而不是按鈕類型

另外KeyPress事件不是由非字符鍵引發的;但是，非字符鍵會引發KeyDown和KeyUp事件。

快樂編碼

來源

2015-04-05 17:34:48

jquery輸入/按鍵不工作

回答

相關問題