使用JQuery获取多个复选框选中值的最佳方法是什么
如何将其存储到数组中并在检查复选框时立即将所有复选框选中的值显示到“#display”div中,并在取消勾选复选框时删除该值。 例如,当我点击Banana然后“#display”div将显示Banana并且我继续点击Grape然后它将显示Banana,Grape。 取消选中复选框时,从“#display”div中删除“Banana”一词,这样“#display”div将只显示“Grape”。 在Jquery。
任何帮助将非常感谢。
使用map()
函数获取选中的值…和join()
以使用,
连接数组。
试试这个
$('.myBox input:checkbox').change(function(){ var tempValue=''; tempValue=$('.myBox input:checkbox').map(function(n){ if(this.checked){ return this.value; }; }).get().join(','); $('#display').html(tempValue); })
要么
简单的方法
$('.myBox input:checkbox').change(function(){ var tempValue=''; tempValue=$('.myBox input:checkbox:checked').map(function(n){ //map all the checked value to tempValue with `,` seperated return this.value; }).get().join(','); $('#display').html(tempValue); })
在这里小提琴
你需要这样的东西:
$(".myBox").on("change", "[type=checkbox]", function () { var s = ""; $(".myBox [type=checkbox]:checked").each(function () { s += this.value + ","; }); $("#display").html(s.slice(0, s.length -1)); });
每次在文本框中发生change
时, each
事件都会获取已checked
复选框的值,并将它们添加到div
。
演示: http : //jsfiddle.net/hungerpain/cqZcX/
$(".myBox").on("change", "[type=checkbox]", function () { var s = ""; $(".myBox [type=checkbox]:checked").each(function () { s += (s == '') ? this.value : "," + this.value; }); $("#display").html(s); });