我目前正在尝试显示隐藏的<div>,其中包含单击两个按钮后的两个输入按钮。

这是我的HTML;

// Button to show <div>
<input type="button" value="Show" id="show" class="show"/>

<div id="hiddenDiv" style="font-size:20px;">
    <input type="button" class="btn-default" id="button1" />
    <input type="button" class="btn-default" id="button2" />
</div>

jQuery;
  $("#hiddenDiv").hide();
    $("#show").click(function () {
        $("#hiddenDiv").animate({ "opacity": "show", "top": "250px" }, "slow");
    });

单击show -button后,我无法显示输入按钮。知道为什么会这样吗?

最佳答案

由于您是在加载HTML之前运行JavaScript的,因此需要将代码放置在ready()事件中,该事件将在HTML加载到页面上时触发。

<script>
    $( document ).ready(function() {
        $("#hiddenDiv").hide();
        $("#show").click(function () {
            $("#hiddenDiv").animate({ "opacity": "show", "top": "250px" }, "slow");
        });
    });
</script>
<input type="button" value="Show" id="show" class="show"/>

<div id="hiddenDiv" style="font-size:20px;">
    <input type="button" class="btn-default" id="button1" />
    <input type="button" class="btn-default" id="button2" />
</div>

有关ready()事件的更多信息,请参见文档:

https://learn.jquery.com/using-jquery-core/document-ready/

09-25 19:54
查看更多