2

ユーザーが検索条件を入力できるようにするための5つのテキスト入力ボックスを備えたフォームを備えたASP.NETMVC3プロジェクトがあります。

現在、ユーザーが1つのフィールドから次のフィールドにタブ移動すると、$('.watched').blur(ajaxSearch);関数を発行する関数がajaxSearchあり、これは問題なく機能します。

.searchResults私の問題は、フィールドをタブで移動するか、結果divに表示される値の1つをクリックするたびに、ajaxSearchが呼び出されることです。

質問の最後に現在の検索JavaScriptを配置しました。

値をテキストボックスに保存し、変更がないか確認してから、別のajax呼び出しを発行したいと思います。

擬似コードのアイデア

var oldvalues =  {}
function saveCurrentValues() {
    foreach( input box on the form ) {
       save the currentvalue of the input box into oldvalues['inputboxid']
    }
}

function isNewSearch() {
    foreach( input box on the form ) {
        if (oldvalues['inputbox.id'] !== input box value) {
            return true;
        }
    }
    return false;
}

foreachとoldvaluesの割り当てを実装する方法がわかりません。javascriptの第一人者が、この実装の正しい方向を教えてくれませんか。(以下のjavascriptにコメント行を入れましたが、この実装で実際に作業を行う必要があると思います。)

javascript

function displayResults(data) {
    $('.searchResults').html(data);
}

function ajaxSearch() {
    // if (isNewSearch() ) {
    //    saveCurrentValues();
          $('#selectedRecord').empty();
          var myForm = $('#searchForm');
          $.post(myForm.URL, myForm.serialize(), displayResults);
    //}
}

$(function () {
    $('.watched').blur(ajaxSearch);
    //saveCurrentValues();
});
4

2 に答える 2

7

独自の関数を作成する代わりに。changeイベントの代わりにこのイベントを使用することはできませんblur

$('.watched').change(ajaxSearch);

変更イベントは、要素(input、textarea)の値が変更されてからぼやけた場合にのみ発生します。

値が変更されると、変更イベントが要素に送信されます。このイベントは、要素、ボックス、および要素に限定されています。選択ボックス、チェックボックス、およびラジオボタンの場合、ユーザーがマウスで選択するとすぐにイベントが発生しますが、他の要素タイプ(input、textarea)の場合、イベントは要素がフォーカスを失うまで延期されます。

これがドキュメントです

于 2013-01-11T16:23:32.997 に答える
3
// Bind to the blur event (and change event)
// but only trigger it when a new value is present:
$('.watched').on('blur change',function(e){
  var $this = $(this),
      curValue = $this.val(),
      lastval = $this.data('last');
  // check if it's a new value
  if (lastVal != curVal){
    // store new value
    $this.data('last',curVal);
    // now call ajax
    ajaxSearch();
  }
});

擬似コードですが、新しいクエリを作成するときにクエリされた最後の既知の値を保存できることを利用してください。

于 2013-01-11T16:23:49.870 に答える