ライブ検索ではなく検索語を送信する（キーアップ機能）

Question

私はカールです。コーディングに関しては、私はまだこの場所と新人には新しいです。私と一緒に抱きしめてください。私はHTMLとCSSにもっと力を入れています。 私は最近、AJAX、JQuery、JSONに基づいてthis Live Search tutorialを見つけました。ここでは、入力フィールドで入力を開始した瞬間から検索機能が即座に反応します。 keyup（）コマンドには、これと関連があるようです。

$('#search').keyup(function(){ 
var searchField = $('#search').val(); 
var myExp = new RegExp(searchField, 'i'); 
$.getJSON('data.json', function(data){ 
    var output = '<ul class="searchresult">'; 
    $.each(data, function(key, val){ 
    if((val.name.search(myExp) != -1) || (val.bio.search(myExp) != -1)) { 
(...) 

現在、ローカルサーバーでこのライブ検索をテストしています。

ユーザー定義のクエリ/検索用語を、入力キー（従来の方法）および/または検索/送信ボタン経由で送信することが可能かどうか疑問に思っていました。私はキーアップ関数をsubmitと置き換えてみました。たとえば、this videoのようなものです。私は、上記のビデオで言及されたこのような提出を適用しようとしましたが、それに応じてそれを働かせることはできませんでした。私はGoogle、YouTube、DailyMotionなどのさまざまなビデオを使ってさまざまなチュートリアルを検索し、さらにstackoverflowや他の同様のサイトで多くの質問を比較しました。私は木の森を逃している可能性が最も高いです。

ご協力いただければ幸いです。前もって感謝します。

Answer 1

入力ボタンが使用されたかどうかを検出するには、コード13のイベント引数 "which"をテストする必要があります（一部のコードサンプル：Submitting a form on 'Enter' with jQuery?）。

また、フィールドのブラーイベントでリッスンする必要があります。 （http://www.w3schools.com/jsref/event_onblur.asp）

最後に、送信ボタンを使用して送信するには、そのボタンのクリックボタンをクリックする必要があります。 （http://api.jquery.com/on/）

Answer 2

フォーム内に検索ボックスを置くことができるので、ユーザーが入力ボタンを押したときに送信されます。通常の送信メソッドを停止し、Ajaxでクエリパラメータを送信します。

function ajaxSubmit(event){ 
 
    event.preventDefault(); 
 
    
 
    alert('submit stopped'); 
 
    
 
    //ajax code here 
 
    
 

 
};

<form action="" method="post" onSubmit="ajaxSubmit(event)"> 
 
    
 
    <label for="search">Search box:</label><br> 
 
    <input type="search" placeholder="Write here and press enter" id="search"> 
 
    
 
</form>