2

我有一个 ASP.NET MVC 3 项目，其中包含一个带有 5 个文本输入框的表单，允许用户输入搜索条件。

目前，当用户从一个字段切换到下一个字段时，我有一个$('.watched').blur(ajaxSearch);函数可以发出我的ajaxSearch函数，这可以正常工作，排序...

我的问题是 ajaxSearch 每次都被调用，每次我通过字段进行选项卡，或单击.searchResults结果 div 中显示的值之一。

我已将我当前的搜索 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);

仅当元素（输入、文本区域）的值发生更改然后模糊时才会发生更改事件。

当元素的值改变时，change 事件被发送到元素。此事件仅限于元素、框和元素。对于选择框、复选框和单选按钮，当用户使用鼠标进行选择时会立即触发事件，但对于其他元素类型（输入、文本区域），事件会延迟到元素失去焦点为止。

这是文档

于 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 回答