jquery - 通过单击页面上的其他位置触发的jQuery键入和更改事件

我有一个包含下拉列表和<input type="text">元素的搜索表单。我想根据是从下拉列表中进行选择还是在字段中键入内容来执行AJAX请求。

我已经使用此脚本来完成此任务-

$('#searchform').on('keyup change', function() {
      //DO THE AJAX SEARCH
}

一切正常，除了事件是通过使用表单后在页面上的任意位置单击触发的，我认为它被视为“更改”。

因此，例如，我将一些搜索结果附加到HTML div，然后当用户单击该结果时，将触发“表单”更改事件，并尝试再次执行该功能。它不会改变结果，但仍会产生不良效果。

有没有一种方法可以使我通过下拉选择或在输入字段中键入来触发AJAX请求，但是如果更改不位于#searchform元素上，它可以忽略该请求吗？

最佳答案

只是另一种选择。您可以将ajax请求绑定到表单提交，然后用其他事件触发提交。可能会因情况而矫kill过正，但如果您需要不同的表单元素以表现不同，则会增加灵活性

$('#searchform').on('submit', function(e) {
    e.preventDefault();
    // Ajax here
});

$('#searchform input').on('keyup', function() {
    $('#searchform').trigger('submit');
});

$('#searchform select').on('change', function() {
    $('#searchform').trigger('submit');
});