单击按钮时出现问题隐藏元素

Question

我尝试通过单击按钮隐藏文本，不确定如何完成：..

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

身体：

<p id="disclaimer" > DDDDDDDDDDDDDDDDDDDDDDDDDD</p>
<asp:Button ID="Button1" CssClass="HideButton"  runat="server" Text="Hide" />

Answer 1

你需要将它包装在ready handler中，但除此之外它应该有效：

$(function() {
    $('.HideButton').click(function () {
        $('#disclaimer').hide();
    }); 
});

（demo - 稍微改变以克服ASP依赖性。）请注意，按钮可能还有其他副作用，参见@Zootius回答。

Answer 2

你的按钮不应该是asp：Button。这样做。

<input type="button" value="Hide" class="HideButton" />

这是因为asp：Button会在点击时产生完整的回发（检查您的页面来源 - 它呈现为表单提交按钮）。

Answer 3

将其放入“document.ready”

document.ready(function() {
     //Your code here
});

Answer 4

尝试：

<script type="text/javascript">
$(document).ready(function(){
$('.HideButton').click(function () {
    $('#disclaimer').hide();
  }); 
});
</script>

您需要告诉浏览器何时将侦听器添加到按钮。通常这是在就绪函数中完成的，因为一旦页面呈现就会一直想要它。