gpt4 book ai didi

javascript - 使用 javascript 和 jquery 动态调整 div 的大小?

转载 作者:太空宇宙 更新时间:2023-11-04 02:00:11 25 4
gpt4 key购买 nike

我正在尝试使用 javascript 和 jquery 通过单击按钮来调整 div 的大小。这一切都在一个 asp.net web 表单中。我对 javascript 的经验很少,对 jquery 几乎没有经验。这是到目前为止我在其他 SO 成员的帮助下获得的代码。除了它不起作用之外,我知道有问题,因为没有显示警报。

感谢任何帮助。

<head id="Head1" runat="server">
<title>Data Display</title>
<script type="text/javascript">
function toggleGridContent() {
var id = "#gridViewContainer";
if ($(id).hasClass("small")) {
alert("found");
$(id).attr("class", "large");
} else {
alert("not");
$(id).attr("class", "small");
}
}
</script>
<style type="text/css">
.small {
height: 200px;
overflow: hidden;
}

.large {
height: auto;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

<input type="button" onclick="toggleGridContent()" value="toggleGridContent" />

<div class="small" id="gridViewContainer" style="border: 1px solid red">
<asp:GridView ID="GridViewNsbAll" AutoGenerateColumns="false" runat="server">
<Columns>
<asp:BoundField DataField="subgroup" HeaderText="subgroup"></asp:BoundField>
<asp:BoundField DataField="count" HeaderText="count"></asp:BoundField>
</Columns>
</asp:GridView>
</div>

</form>
</body>
</html>

最佳答案

您必须添加对 jQuery 库的引用。如果你的网站上有它,你可以使用这样的东西:

<script type="text/javascript" src="jquery.js"></script>

链接到最新的托管版本会更容易

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

关于javascript - 使用 javascript 和 jquery 动态调整 div 的大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41902623/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com