Question

我有这个功能：

<script type="text/javascript">
    $(function() {
        $('#subbutton').click(function() {
            $('#subbutton').hide();

        });
    });
</script>

点击后只需隐藏此按钮：

 <a id="subbutton" class="button" href="javascript:TINY.box.show({url: 'follow',width:600,height:170,openjs:'initPopupLogin',opacity:30})"><span>Button</span></a>

现在，如果我尝试使用相同的功能，但稍后在页面上有一个链接，它不起作用（我已经删除了此时的原始按钮）这是代码：

<div id="subbutton">
        <a href="#"><span>Button</span></a>
</div>

我已经尝试将id放在锚点和span中，似乎没有任何东西可用于此链接。知道为什么这不起作用吗？（我删除了原始按钮，以便第二个按钮是页面上的唯一ID）

Answer 1

尝试使用.on来附加您的事件处理程序。我怀疑在你附加事件处理程序时按钮不在dom中。

$(document).on('click', '#subbutton', function() {
    $(this).hide();
});

编辑现在我明白了这个问题。你最好给按钮一个类并使用类选择器。

Answer 2

.hide不会从页面中删除元素，因此您的选择器仍将匹配第一个元素。您需要使用.remove从DOM中删除第一个元素，以便第二个选择器可以工作。

此外，小jQuery优化。不需要嵌套调用$（'＃subbutton'）。充其量，它更难维护，最坏的情况是，如果你把它放在一个大循环中，它可能会导致性能问题。这样更好。

$(function() {
    $('#subbutton').click(function() {
        $(this).remove();

    });
});

Answer 3

你错过了“在此之后：

<a id="subbutton" class="button

和Id必须是唯一的。然后它应该工作。

Answer 4

不要重复使用ID，它们必须是唯一的。将id传递给函数

Answer 5

将您的javascript更改为：

 $(function() {
        $('#subbutton').live("click",function() {
          $(this).hide();
        });
    });

http://jsfiddle.net/W2agx/

也不要重复使用id。将一个类用于您希望能够一起选择的多个DOM元素。

相同的JQuery函数适用于一个链接，而不是另一个链接

5 个答案: