我正在尝试学习一些 jQuery 以添加到我正在创建的网站中。当用户单击“添加评论”链接时,会出现一个文本区域和发表评论按钮,但我似乎无法让它工作。
<html>
<head>
<script type="text/javascript" src="jquery-1.10.0.min.js"></script>
<script type="text/javascript" language="javascript">
$("#addcomment").click(function () {
$("#postComment").show("slow");
});
</script>
<title></title>
<link rel="stylesheet" type="text/css" href="test.css" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<div id="addcomment">
<a href='#' id="addcomment" class="addcomment">add comment</a>
</div>
<div id="postComment" class="postComment">
<textarea name="comment" id="comment" class="comment"></textarea>
<input type="submit" value="Post Comment"/>
</div>
</body>
和CSS
#postComment{
display: none;
我已经在 http://jsfiddle.net/2dA3p/2/ 上试过了没有问题,但是当使用 netbeans 运行时我没有运气。我希望有一个简单的修复或我正在做的愚蠢的事情。
PS这是我的第一篇文章,所以希望我正确地遵循了规则:S
谢谢
最佳答案
您必须在元素存在后注册您的处理程序,因此它必须包装在 DOM 就绪处理程序中。在 jQuery 中,其语法是将代码包装在 $(function() {});
此外,元素 ID 必须是唯一的,或者未定义处理程序实际绑定(bind)到哪个元素(通常是 jQuery 遇到的 DOM 树中的第一个)。
如果事件需要绑定(bind)到多个元素,请使用class属性而不是ID属性,然后使用类选择器。
$(function () {
$("#addcomment").click(function () {
$("#postComment").show("slow");
});
});
可能的标记(减去多余的类,但如果需要,您可以重新添加它们,没有坏处):
<div id="container">
<div id="mainContent">
<div id="addcomment"> <a href='#'>add comment</a></div>
<div id='postComment'>
<textarea name='comment' id='comment'></textarea>
<input type='submit' value='Post Comment' />
</div>
</div>
</div>
关于jQuery 显示评论框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18168319/