Jquery - customize ui.ja

Question

我正在使用jquery的"ui.js"和"ui.css"。

当我有这个片段时：

<div class="ui-widget">
    <label for="tags">Tags: </label>
    <input id="tags">
</div>

一切正常，但是当用户选择一个项目时，我想触发一个事件：

$(document).ready(function () {
    $('input#tags').on('change', function() {
      alert("event")
    });
});

它不起作用，有人知道如何在用户选择项目时触发事件吗？

问候！

Answer 1

您的代码按原样工作正常：

JSFiddle： http://jsfiddle.net/TrueBlueAussie/Vnhd8/

几个注意事项...

• 由于您使用的是change而不是keyup因此您需要离开字段才能触发事件。
• 现代/首选的加载语法很简单$(function{...});
由于 id 在
• 页面上应该是唯一的，并且是最快的查找方法，因此在 id 之前添加input选择器实际上可能会减慢搜索速度。

更整洁的版本

$(function () {
    $('#tags').on('change', function() {
      alert("event")
    });
});

如果要允许动态创建的元素，请使用应用于不会更改的元素（并且是目标的祖先）的延迟语法on：

延迟的"开启"版本：

$(function () {
    $(document).on('change', '#tags', function() {
      alert("event")
    });
});

如果您想要改为按键事件：

JSFiddle： http://jsfiddle.net/TrueBlueAussie/Vnhd8/4/

$(function () {
    $(document).on('keyup', '#tags', function() {
      alert('event');
    });
});

只有上面的最后一个JSFiddle使用jQueryUI（只是为了确保它与事件没有什么不同）。