Question

我想在div的下方创建一个按钮（在div之外）和一个段落（或任何文本字段）。

＆＃13;

$(document).ready(function() {
  $('#butt').mousedown(function() {
    $("#butt").hide();

  });
  $("#pushed").mouseup(function() {
    $("#butt").show();

  });
  $("#butt").click(function() {
    button_click();
  });
});


var clicks = 0;

function button_click() {
  clicks = parseInt(clicks) + parseInt(1);
  var divData = document.getElementById("showCount");
  divData.innerHTML = "Clicks:" + clicks;
}

＆＃13;

<!-- <link type="text/css" rel="stylesheet" href="CSS.css"/> -->
<form name="ButtonForm">
  <div id="container">

    <div id="pushed"></div>

    <div id="butt"></div>

  </div>

  <div id="showCount"></div>

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js" type="text/javascript"></script>
  <!--<script src="Untitled-1.js" type="text/javascript"></script>-->
</form>

＆＃13;

Answer 1

您的div元素为空，并且没有CSS可以为它们提供任何明确的大小，因此您无法看到它们点击它们。

此外，mousedown事件处理程序可以而且应该与click的{{1}}处理程序结合使用，butt事件处理程序应该只是mouseup事件也是如此。

此外，您只需要更新点击次数，而不是单词＆＃34; Clicks＆＃34;，因此请使用click元素为数字创建单独的占位符，然后您可以进行硬编码单词＆＃34;点击＆＃34;进入span。

最后，要将数字递增1，您可以使用前置或后置增量运算符（++）。

＆＃13;

div

＆＃13;

$(document).ready(function() {
  var clicks = 0;
  var divData = $("#clickCount");
  
  $("#pushed").on("click", function() {
    $("#butt").show();
  });
  
  $("#butt").on("click", function() {
    $("#butt").hide();
    clicks++;  // increment the counter by one
    divData.html(clicks);
  });
});

＆＃13;

#pushed, #butt {height:50px; width:150px; background-color:green; margin:5px;}

＆＃13;

Answer 2

首先，您应该简化代码。隐藏和显示按钮不是产生您正在寻找的结果所必需的。

其次，将#butt元素更改为实际按钮，以便您可以查看并单击。

第三，确保在包含jquery之后加载脚本。

nodeBox

我无法使这个JavaScript计数工作

2 个答案: