色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

jquery checkbox 列表

錢琪琛2年前7瀏覽0評論

JQuery是一個JavaScript庫,用于DOM操作,事件處理和Ajax請求等. JQuery提供了很多的工具函數和方法,來簡化JavaScript的開發,其中包括處理復選框的checkbox列表.

使用JQuery創建一個checkbox列表非常簡單:

<html><head><script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script></head><body><div><input type="checkbox" name="checkbox1" value="1">Checkbox 1
</div><div><input type="checkbox" name="checkbox2" value="2">Checkbox 2
</div><div><input type="checkbox" name="checkbox3" value="3">Checkbox 3
</div><button id="check-all">Check all<button id="check-none">Uncheck all<button id="check-toggle">Toggle all<script>$(document).ready(function(){
$("#check-all").click(function(){
$("input[type='checkbox']").prop('checked', true);
});
$("#check-none").click(function(){
$("input[type='checkbox']").prop('checked', false);
});
$("#check-toggle").click(function(){
$("input[type='checkbox']").each(function(){
$(this).prop('checked', !$(this).prop('checked'));
});
});
});
</script></body></html>

上面的示例中,我們創建了三個checkbox和三個按鈕,用于控制以不同的方式選中/取消選中這些checkbox。jQuery中的選擇器$("input[type='checkbox']")用于選擇所有的checkbox,prop()方法用于設置其checked屬性來選擇/取消選中。

jQuery也提供了其他方法來處理checkbox,例如,在表單提交之前檢查哪些checkbox已被選中:

<html><head><script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script></head><body><form><input type="checkbox" name="fruits" value="apple">apple
<input type="checkbox" name="fruits" value="banana">banana
<input type="checkbox" name="fruits" value="orange">orange
</form><button id="submit">Submit<script>$("#submit").click(function(){
var selected = $("input[type='checkbox'][name='fruits']:checked").map(function(){
return this.value;
}).get();
alert("Selected fruits: " + selected.join(", "));
});
</script></body></html>

上面的示例中,我們用map()方法來將選中checkbox的值組合成一個數組,并使用join()方法將它們連接成一個字符串。

總的來說,使用jQuery處理checkbox列表非常簡單,jQuery提供了很多方法和函數,節省了開發的時間和精力。