【问题标题】:Jquery UI autocomplete input - How to check if input is empty on change?Jquery UI 自动完成输入 - 如何检查输入是否在更改时为空?
【发布时间】:2011-07-27 21:47:02
【问题描述】:

我的页面上有一个 Jquery UI 自动完成字段,当输入为空时我需要做一些事情(即用户输入了一些内容,然后将其全部删除)。

无论他们最初输入的内容是否产生了自动完成结果,都必须触发此事件。

关键是如果输入的条目没有自动完成结果,则显示一个按钮,如果有结果或输入为空,则将其删除。

更新 这个我试过了……

$('#employeeAutocomplete').change(function() {
     alert("eventFired");
     if($( "#employeeAutocomplete" ).val() == ''){
         $('#createEmployeeBtn').hide();
     }
});

并且不显示警报....

谢谢, 丹尼

【问题讨论】:

    标签: javascript jquery jquery-ui events autocomplete


    【解决方案1】:

    http://forum.jquery.com/topic/autocomplete-and-change-event

    关于同样的问题:

    我发现更改:确实有效,但仅当输入失去焦点时。

    为了达到我想要的效果,我实施的解决方案是将我自己的检查作为 source: function 的一部分实施。我将 minLength: 设置为 0,如果长度小于 2,我会加载我的默认显示数据。

    【讨论】:

      【解决方案2】:

      超级老问题,但我认为我找到了一个对我有用并且可能对其他人有所帮助的解决方案。那么是什么让它对我有用而无需在autocomplete 周围跳舞,而changekeypress 似乎没有缺陷的是keyup

      只需在 autocomplete 块旁边添加 keyup 事件处理程序即可触发事件,无论失去焦点或更改字段值,即使清除值也是如此。这使得该功能适用​​于我能想到的所有情况。代码如下:

      $('#employeeAutocomplete').keyup(function() {
        if($('#employeeAutocomplete').val() === '') {
           $('#createEmployeeBtn').hide();
        }
      });
      

      【讨论】:

        【解决方案3】:

        看看这个插件

        http://www.zurb.com/playground/jquery-text-change-custom-event

        它是真正的 textchange 事件的更接近的处理程序

        【讨论】:

        • 大赚一笔。这花了我大约 5 分钟的时间来实现,并且效果很好。其他解决方案均无效。感谢您发布此答案...
        【解决方案4】:

        我知道这篇文章很老了,但我也在尝试同样的想法,但这里的答案并不让我满意。

        所以对我自己来说,我对 jquery 的模糊事件进行了空值测试。

        $('.input').focus(function() { $(this).autocomplete({ // autocomplete code here }) }).blur(function() { if($(this).val() == "") { } });

        【讨论】:

          【解决方案5】:

          希望这对你有帮助:) .change() - jQuery API

          【讨论】:

          • 可能比我的回答容易!
          • 我试过了,但它似乎没有触发...不知道为什么... $('#employeeAutocomplete').change(function() { if($( "#employeeAutocomplete " ).val() == ''){ $('#createEmployeeBtn').hide(); } }); });
          • 因为在输入失去焦点之前不会触发 change() 事件。
          【解决方案6】:

          【讨论】:

          • 嗯,似乎 .keypress 和 .change 都不能很好地配合 jquery 自动完成控件...
          • 标题中是否包含 jquery 库?试试其他功能,用firebug看看是什么问题
          • 自动完成是指该字段在您键入时显示结果吗?
          • 是的,Jquery 肯定在那里,一直在使用它。是的,这就是我所说的自动完成的意思。
          • 我相信你会在 5 分钟内找到谷歌的解决方案,只需要研究技能。
          【解决方案7】:
          $('#employeeAutocomplete').change(function() {
               alert("eventFired");
               if(this.value == ''){
                   $('#createEmployeeBtn').hide();
               }
          });
          

          【讨论】:

            【解决方案8】:

            jquery ui的autocomplete有自己的change事件,你试过了吗?

            $( ".selector" ).autocomplete({
               change: function(event, ui) { ... }
            });
            

            http://jqueryui.com/demos/autocomplete/#event-change

            【讨论】:

            • 是的,看了一下,好像是在字段模糊时触发,而不是在内容更改时触发。
            • 我已经使用了上面的插件,我把它作为一个额外的答案发布,让新读者更快地找到它
            【解决方案9】:

            我已经通过自动完成关闭事件解决了这个问题! 当结果列表为空时触发关闭。我的情况是,这对应于一个空的输入字段。

            http://jqueryui.com/demos/autocomplete/#event-close

            【讨论】:

              【解决方案10】:

              好的人。以下绝对有效,并且是一个非常简单和优雅的解决方案,需要几行代码。

              100% 保证工作。

              @Milox 已经提到过:

              http://zurb.com/playground/jquery-text-change-custom-event

              这个 jQuery 插件很小。下载/复制它并链接到“js”文件后,请使用以下内容:

              jQuery('#input').bind('notext',function () {
                  console.log('text field is empty');
              });
              

              还有其他配置,但这就是我所需要的。繁荣。已排序。

              【讨论】:

                猜你喜欢
                • 1970-01-01
                • 2011-03-22
                • 1970-01-01
                • 2010-12-23
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                相关资源
                最近更新 更多