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

Question

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

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

但它没有用。

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

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

Answer 1

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

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

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

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

因此，即使订单是这样的，它也会起作用：

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

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

演示

Answer 2

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

Answer 3

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

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

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