javascript - jQuery 输入按钮点击事件监听器

Question

全新的 jQuery。 我试图在我的页面上为以下控件设置事件监听器，单击该控件时会显示警报:

<input type="button" id="filter" name="filter" value="Filter" />

但是没有用。

$("#filter").button().click(function(){...});

如何使用 jQuery 为输入按钮控件创建事件监听器？

Answer 1

首先，button() 是一个 jQuery ui 函数，用于创建 button widget这与 jQuery 核心无关，它只是为按钮设置样式。
因此，如果您想使用该小部件，请添加 jQuery ui 的 javascript 和 CSS 文件，或者删除它，如下所示:

$("#filter").click(function(){
    alert('clicked!');
});

可能导致您出现问题的另一件事是，如果您没有等待输入被呈现，而是在输入之前编写了代码。 jQuery 有 ready function ，或者它是 $(func) 的别名，它会在 DOM 准备就绪后执行回调。
用法:

$(function(){
    $("#filter").click(function(){
        alert('clicked!');
    });
});

所以即使顺序是这样它也会起作用:

$(function(){
    $("#filter").click(function(){
        alert('clicked!');
    });
});

<input type="button" id="filter" name="filter" value="Filter" />

DEMO