Question

全新的jQuery。我试图在我的页面上为以下控件设置一个事件监听器，当点击它时会显示一个警告：

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

但它不起作用。

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

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

Answer 1

首先，button()是一个jQuery ui函数来创建一个与jQuery核心无关的button widget，它只是为按钮设置样式。
因此，如果您想使用小部件添加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

Answer 2

$("#filter").click(function(){
    //Put your code here
});

Answer 3

更多关于gdoron的答案，也可以这样做：

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

无需将它们全部放入$(function(){...})

jQuery输入按钮单击事件监听器

3 个答案: