j查询输入按钮单击事件侦听器

jQuery input button click event listener

本文关键字：事件 侦听器 单击 按钮 查询 输入      更新时间：2023-09-26

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

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

但它没有用。

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

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

首先，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" />

演示

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

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

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

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

相关文章：