web-dev-qa-db-ja.com

jQuery入力ボタンクリックイベントリスナー

JQueryの真新しい。クリックするとアラートが表示されるページ上の次のコントロールのイベントリスナーを設定しようとしました。

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

しかし、うまくいきませんでした。

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

JQueryを使用して入力ボタンコントロールのイベントリスナーを作成するにはどうすればよいですか？

javascriptjquerybuttonjavascript-eventsonclick
31
Bob

まず、button()は、jQueryコアとは何の関係もない button widget を作成するjQuery ui関数であり、ボタンのスタイルを設定するだけです。
したがって、ウィジェットを使用する場合は、jQuery uiのjavascriptファイルとCSSファイルを追加するか、次のように削除します。

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

問題を引き起こした可能性がある別のことは、入力がレンダリングされるのを待たずに、入力の前にコードを記述した場合です。 jQueryにはready function、またはDOMの準備ができたらコールバックを実行するエイリアス$(func)があります。
使用法：

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

したがって、順序がこれであっても機能します：

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

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

[〜＃〜] demo [〜＃〜]

61
gdoron
$("#filter").click(function(){
    //Put your code here
});
5
Danilo Valente

Gdoronの答えの詳細については、次の方法でも実行できます。

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

それらをすべて$(function(){...})に配置する必要はありません

3
H0WARD