Question

我有以下代码

    <div id="display_form">
    <script type="text/javascript">     
        $(document).ready(function () {
            $('#display_form_button').on('click', function () {
                 $('#main_content').show();
            });
        });
    </script>
    <asp:Button id="display_form_button" runat="server" Text="Create Form" CssClass="create_form_button"/>
</div>

然后我有一个包含大量内容的div，例如表等

    <div id="main_content">
        tables etc
     </div>

在css中，display:none;设置了main_content的id，所以当页面加载时它不会出现。然后，当我点击按钮时，我希望它出现。我一直在谷歌搜索和搜索堆栈溢出一段时间，似乎无法正确。

Answer 1

您显示的是#main_content，而不是#input_form

应该是：

$('#input_form').show();

此外，您的点击事件位于ID为#create_form_button的元素上...因此该按钮需要具有该ID，而不是类。所以改为：

$('#display_form_button').on('click'...

Answer 2

按钮的id是display_form_button但是你正在执行的jquery代码$('#create_form_button')

Answer 3

您的代码中没有任何问题，如果您点击Button它会显示DIV，但会重新加载该页面，那么DIV会变成Invisible .. < / p>

在JQuery中添加Return false;并尝试相同的操作。

   $(document).ready(function () {
        $('#ContentPlaceHolder1_display_form_button').on('click', function () {
            $('#main_content').show();
            return false;
        });
    });

jquery显示div，我哪里错了

3 个答案: