在文本框值更改而不是 keyup 事件上触发函数答案

【问题标题】：Firing a function on textbox value change instead of keyup event在文本框值更改而不是 keyup 事件上触发函数
【发布时间】：2011-09-29 19:59:26
【问题描述】：

以下代码目前仅在 keyup 事件发生时生成搜索查询。在我开始使用 webkit 之前，这一直不是问题，现在可以在不按任何键的情况下清除搜索字段（通过单击搜索字段中的“x”）。

是否可以在搜索框发生变化时触发相同的功能？

我尝试将 .keyup 替换为 .change，但是当搜索框中发生更改时，这似乎没有产生任何响应。

$('#search').keyup(function(e){
  e.preventDefault();
  search = $(this).val();
  $.ajax({
    url: '/lists.xml?search='+search,
    dataType: "xml",
    success: parseXML
  });
});

任何帮助将不胜感激！

编辑：经过进一步研究，我发现了这个example。

以下代码与上面的代码结合使用：

$('#search').click(function(e){
  if($(this).val()==""){
  e.preventDefault();
  search = $(this).val();

  $.ajax({
    url: '/lists.xml?search='+search,
    dataType: "xml",
    success: parseXML
  });
  }
});

【问题讨论】：

您的事件正在为keyup 触发，您可以使用focus 或blur

标签： javascript ajax jquery

【解决方案1】：

$('#search').blur(function(e) {  // you may use `focus`
    search = $(this).val();
    if (search != null || search != '') {
        $.ajax({
            url: '/lists.xml?search=' + search,
            dataType: "xml",
            success: parseXML
        });
    }
});

【讨论】：

@shyvy88 如果它不起作用，请发表评论，我会进一步尝试。

【解决方案2】：

据我所知，更改、模糊和焦点事件仅在您将焦点从文本框移开时发生。然后他们只检查之前的值是否与原始值相同。

因此，如果先前的值为“”并且您键入“asdf”，然后单击文本框以失去焦点，您的函数将触发。所以现在值是“asdf”。如果您键入“asdfeee”，然后删除“eee”并移开焦点，事件将不会触发，因为该值仍将等于“asdf”。

我认为这里最简单的解决方案是保留 keyup 事件处理程序，而只需添加一个 click 事件处理程序，该处理程序执行完全相同的操作来解决 WebKit 行为。

【讨论】：

我在搜索字段中添加了一个点击事件，但每次点击该字段时它都会触发搜索。我添加了一个 if 语句，仅在清除该字段时触发搜索，这就是您单击 webkit“x”时发生的情况。还发现了这个example 在原始问题中查看我的编辑以获取已编辑的代码。

【解决方案3】：

经过一些进一步的研究，我想出了一个解决我自己问题的方法。为了考虑 webkit 功能，我添加了 2 个事件处理程序，如下所示。这不是一个完美的解决方案，但它现在可以......

$('#search').keyup(function(e){
  e.preventDefault();
  search = $(this).val();
  $.ajax({
    url: '/lists.xml?search='+search,
    dataType: "xml",
    success: parseXML
  });
}); 

$('#search').click(function(e){
  if($(this).val()==""){
  e.preventDefault();
  search = $(this).val();

  $.ajax({
    url: '/lists.xml?search='+search,
    dataType: "xml",
    success: parseXML
  });
  }
});

这个example 帮助得出了解决方案。

【讨论】：