Question

var countChecked = function () {
  var n = $("input:checked").length;
  $("#count").text(n + (n === 1 ? " is" : " are") + " checked!");
};

countChecked();
alert();        // this alert

$("input[type=checkbox]").on("click", countChecked);

我使用此代码计算要检查的复选框输入的数量。

使用alert()这很有效。但没有警报，这是行不通的。我该如何解决？

Answer 1

只有一行代码足以满足你的结果： -

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="checkbox" name="vehicle" value="Cycle"> I have a cycle<br>
<input type="checkbox" name="vehicle" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle" value="Auto"> I have a Auto<br>
<input type="checkbox" name="vehicle" value="Car"> I have a car<br>
<input type="checkbox" name="vehicle" value="Bus"> I have a bus<br>
<input type="checkbox" name="vehicle" value="Truck"> I have a truck<br>

＆＃13;

alert()

＆＃13;

注意： - 您的代码开始处理而不等待文档正确加载所以基本上它需要失败，但是当$(document).ready(function(){出现时它等待文档正确呈现，然后您编码输出结果

将整个代码放在alert()内，您就可以了（然后您也可以删除{{1}}）。

但是我给出了更简单的解决方案。谢谢

Answer 2

HTML CODE：

var countChecked = function() {
var n = $("input:checked" ).length;
$( "#count" ).text( n + (n === 1 ? " is" : " are") + " checked!" );
};
  countChecked();

$( "input[type=checkbox]" ).on( "click", countChecked );

JS CODE：

$( "input[type=checkbox]" ).on( "click",function(){
    alert($("input[type=checkbox]:checked").length);
});

工作jsfiddle。

您可能正在使用js代码上方的文档，我删除了该代码。

试一试它应该有效。

Answer 3

使用alert（）这项工作很好。但是没有警报（）这不起作用。我该如何解决呢？

代码不会等到DOM准备就绪。 alert()是一个阻塞事件，之后通常会加载DOM。在没有警报的情况下实现所需功能的一种方法是使用DOMContentLoaded观察DOM上的.ready()事件（即$(document).ready()）。

$(document).ready(function() {
  var countChecked = function() {
    var n = $("input:checked").length;
    $("#count").text(n + (n === 1 ? " is" : " are") + " checked!");
  };

  countChecked();

  $("input[type=checkbox]").on("click", countChecked);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>Count:<span id="count"></span></div>
<div><input type="checkbox" value="1" id="one"><label for="one">1</label></div>
<div><input type="checkbox" value="2" id="two"><label for="one">2</label></div>

Answer 4

您的代码需要附带document.ready Jquery函数

$(document).ready(function(){
  var countChecked = function () {
    var n = $("input:checked").length;
    $("#count").text(n + (n === 1 ? " is" : " are") + " checked!");
  };

 countChecked();
 alert();        // this alert

 $("input[type=checkbox]").on("click", countChecked);
})

Jquery代码无法正常工作

4 个答案: