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

如果图标是在页面加载后动态添加的，则该单击事件将不起作用。你需要使用on代替。

这是使用它的一种方法：

$(document).on("click", ".icon-remove", function() {
    alert("HELLO");
    $(".login-window").hide();
    $(".register-window").hide();
    $(".shadow").hide();
});
于 2013-02-13T17:17:35.797 回答
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 回答
0

你的代码没问题。也许您的 JavaScript 代码中存在一些错误，导致整个事情无法正常工作。例如，在 Firefox 上使用 Firebug，您可以检查控制台选项卡以查看代码中是否存在错误。

这是用于测试您的代码的 JS Bin：http: //jsbin.com/obogof/4

对于这一CSS部分，您必须确保您的 CSS 代码位于影响.icon-remove该类的任何其他 CSS 规则之后。它在这里正常工作：http: //jsbin.com/obogof/5

于 2013-02-13T17:17:37.163 回答