6

Font Awesomeでは、 icon-removeアイコンを使用したいと思います。だから私は<i class="icon-remove"></i>私のHTMLにあり、それは完璧に機能します。ただし、これをjQueryでバインド可能にして、divを閉じたいと思いました。

だから私は使用しました：

    $(".icon-remove").click(function() {
        alert("HELLO");
        $(".login-window").hide();
        $(".register-window").hide();
        $(".shadow").hide();
    });

ただし、これは機能しません。クリックしても何も起こりません。

これは私が使用したCSSです（注意：cursor: pointer;機能しません）。

.icon-remove {
    display: block;

    color: #444;
    cursor: pointer;
    float: right;
    margin-right: 15px;
}

私は正確に何を間違っているのですか？

4

3 に答える 3

7

ページの読み込み後にアイコンが動的に追加された場合、そのクリックイベントは機能しません。代わりにを使用する必要があります。

これを使用する1つの方法は次のとおりです。

$(document).on("click", ".icon-remove", function() {
    alert("HELLO");
    $(".login-window").hide();
    $(".register-window").hide();
    $(".shadow").hide();
});
于 2013-02-13T17:17:35.797 に答える
0

あなたのコードは大丈夫です。JavaScriptコードにエラーがあり、すべてが機能しなくなっている可能性があります。たとえば、FirefoxでFirebugを使用すると、[コンソール]タブをチェックして、コードにエラーがあるかどうかを確認できます。

コードをテストするためのJSビンは次のとおりです：http：//jsbin.com/obogof/4

その部分については、CSSコードがクラスCSSに影響を与える他のCSSルールの後に来ることを確認する必要があります。.icon-removeここでは正しく機能します：http：//jsbin.com/obogof/5

于 2013-02-13T17:17:37.163 に答える
0

DOMの準備ができた後にJavaScriptを実行していますか？次のものが必要になります。

$(document).on("click", ".icon-remove", function() {
    alert("HELLO");
    $(".login-window").hide();
    $(".register-window").hide();
    $(".shadow").hide();
});
于 2013-02-13T17:18:47.573 に答える