Question

我试图通过单击按钮隐藏我的内容。但是页面加载时，内容是隐藏的，但在页面加载完成后会显示内容。该内容不会隐藏。我正在使用Visual Studio 2017社区和asp.net/vb.net框架。但是，相同的JQuery代码也可以在我的文本编辑器和浏览器上运行。这是我的示例代码：

<p id="justp" class="testcls">Hi Hide me!</p>
    <asp:Button ID="testbtn" runat="server" Text="hide me" />
     <script>
        $(function () {
            $('#testbtn').click(function () {
                $('.testcls').hide();

            });
        });
    </script>

我尝试在hide（）内部传递警报，并且成功运行它：

$('.testcls').hide(alert("Hello"));

出什么问题了？我该怎么解决？

Answer 1

如果您只是使用此按钮在客户端上隐藏/显示您的内容（不进行服务器端计算或类似的操作），请使用普通的input / button标签：

替换此： <asp:Button ID="testbtn" runat="server" Text="hide me" />

此行： <button type="button" id="testbtn">Hide me!</button>

如上所述，该解决方案仅在不需要提交任何数据的情况下才有效。

Answer 2

出什么问题了？

单击后该按钮将提交您的表单，因此页面将刷新，视图将返回默认状态。

我该如何解决？

您有几种更改此行为的方法：

如果您可以控制asp代码，则可以删除runat="server"以防止按钮提交：
```
<asp:Button ID="testbtn" Text="hide me" />
```
您只需在事件结束时添加return false;语句。

另一种方法是使用preventDefault()阻止默认行为，例如：

$('#testbtn').click(function (e) {
    e.preventDefault();

    $('.testcls').hide();
});

我推荐给您的是使用UseSubmitBehavior：

<asp:Button ID="testbtn" runat="server" UseSubmitBehavior="false" Text="hide me" />

最后的选择是使用纯HTML代码，例如：

<button type="button" id="testbtn">Hide me!</button>

jQuery隐藏不会隐藏vb.net/asp.net网络表单中的任何内容

2 个答案: