Jquery - customize ui.ja

Jquery - customize ui.ja

本文关键字:ja ui customize Jquery      更新时间:2023-09-26

我正在使用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")
    });
});

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

问候!

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

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(只是为了确保它与事件没有什么不同)。