Question

我的html代码非常简单，我希望有一个（显示/隐藏）按钮，当按下时会向下滚动纸张的摘要，再次按下时会将其向上滚动。我在谷歌网站的HTML框中使用JQuery 1.5。 html框的第一行是

然后是html：

html框的最后一部分是以下脚本：

＆＃13;

$("#abstract1").click(function () {
    $("abstract1").slideToggle("fast");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.js"></script>

<div><font color="#3d85c6"><b>Working Papers</b></font></div>
    
<div><b><font color="#0b5394"><a>Paper 1</a>
&nbsp;</font></b><button id="abstract1"><b>Abstract</b></button><br/> </div>
<abstract1 style="display:none">
<div style="line-height:175%;margin-bottom:1em"><font size="2"><font size="2">
blah blah blah...
&nbsp;</font></font></div>
</abstract1>

＆＃13;

作为一个并不真正了解html的人，我对此非常惊讶:)唯一的问题是，在第一次点击时，摘要立即显示（不会滑动），第二次点击它似乎向下滚动（在它已经可见之后）。然后它完美地工作，向下滚动......

我做错了什么？

非常感谢!!

Answer 1

您的HTML无效。您似乎有<abstract1>之类的无效标记，并且往往会在标记上加倍。在下面的代码段中，我已将<abstract1>代码更改为<div>代码并将abstract1类应用于此代码，允许您使用选择器{div}来定位div类您的javascript代码中的{1}}。

我也已经清理了＃39;稍微提高您的代码，以便使用更合适的HTML标记（并删除那些不必要的标记）。

有关工作示例，请参阅下面的代码段：

＆＃13;

.abstract1

＆＃13;

$("#abstract1").click(function () {
    $(".abstract1").slideToggle("fast");
});

＆＃13;

JQuery切换按钮前两次点击不按预期工作

1 个答案: