按钮单击不运行JavaScript

Question

我有一个按钮页面，我想要隐藏/取消隐藏它下面的字段：

<button id="post1-new-comment-button" type="button">Click</button>
<input id="post1-new-comment" name="comment[body]" size="50" type="text" />

使用以下css

#post1-new-comment {
    display: none;
}

和javascript

$(function() {
    return $("#post1-new-comment-button").click(function() {
        return $("#post1-new-comment").val("").toggle();
    });
});

但是单击按钮时没有任何反应。我在这做错了什么？ 在jsfiddle这里：http://jsfiddle.net/Z5hqZ/

Answer 1

你的小提琴没有用，因为你没有jquery。我更新了它并删除了返回。

http://jsfiddle.net/Z5hqZ/5/

$(function() {
  $("#post1-new-comment-button").click(function() {
    $("#post1-new-comment").val("").toggle();
  });
});

Answer 2

试试这个：

$(function() {
    $("#post1-new-comment-button").click(function() {
        $("#post1-new-comment").val("").toggle();
    });
});

Answer 3

当你想要使用它时，请记得包含jQuery，因为它不在你的小提琴上，你的html也是错的，在你的小提琴上：

<button id="post1-new-comment-button" type="button">

应该是：

<button id="post1-new-comment-button"></button>

否则，输入将在按钮内。在您的示例中，您没有关闭<button>代码，也无需添加type="button"，并且您的JavaScript上也不需要return ...

更新了工作示例：http://jsfiddle.net/darkajax/VKGdv/

Answer 4

隐藏/取消隐藏 -

$(function() {
    $("#post1-new-comment-button").click(function() {
        $("#post1-new-comment").toggle();
    });
});

Answer 5

试试这个。并且不要忘记将jsfiddle中的库设置为jQuery，并在DOM ready上执行脚本

$(function() {
$("#post1-new-comment-button").click(function() {
    $("#post1-new-comment").toggle();
});

}）;

以下是工作链接：http://jsfiddle.net/Z5hqZ/2/

并且不要忘记关闭按钮的标签

Answer 6

实际上是以上/以下所有：

1. 您需要包含jQuery
2. 您的按钮需要一个结束标记（最好是一些文本显示在其间的按钮上）

3. 使用以下内容：

   $(document).ready(function(){
     $("#post1-new-comment-button").click(function() {
       $("#post1-new-comment").toggle();
     });
   });