1. 程式人生 > >Jquery獲取勾選複選框裡面的值並且動態新增到一個新的div裡面

Jquery獲取勾選複選框裡面的值並且動態新增到一個新的div裡面


<script src="js/jquery-1.7.min.js"></script>


<script type="text/javascript">
$(function() {
//獲取所有複選框
var $xz = $("input[name=check-2]:checked");
$("input:button").click(function() {
text = $("input:checkbox[name='check-1']:checked").map(function() {
return $(this).val();
}).get();
alert("選中的checkbox的值為:" + text);
//給p標籤動態新增內容
$("#addid").append("<div style='background-color: red;'>" + text + "</div>");
});
});
</script>

<p>1-1加速度第一定律 <label class="mo-lable-inputck"><input type="checkbox" name="check-1" value="1-1加速度第一定律" /></label></p>
<p>1-2加速度第一定律 <label class="mo-lable-inputck"><input type="checkbox" name="check-1" value="1-2加速度第一定律" /></label></p>
<p>1-3加速度第一定律 <label class="mo-lable-inputck"><input type="checkbox" name="check-1" value="1-3加速度第一定律" /></label></p>
<p>1-4加速度第一定律 <label class="mo-lable-inputck"><input type="checkbox" name="check-1" value="1-4加速度第一定律" /></label></p>
<p>1-5加速度第一定律 <label class="mo-lable-inputck"><input type="checkbox" name="check-1" value="1-5加速度第一定律" /></label></p>
<input type="button" value="提交">



<p id="addid"></p>