How does jquery get the selected value based on the multiple marquee name.

Using the Multi box name to get the selected value can be implemented with the following jquery code

123	$("input:checkbox[name=‘test‘]:checked").each(function() { // 遍历name=test的多选框  $(this).val();  // 每一个被选中项的值});

Example Demo: Give two sets of multi-box, click the button to get two groups of selected items

The sample code is as follows

1. Creating HTML Elements

   12345678910111213141516

   <divclass="box">    <span>请输入用户名，限定字母、数字或下划线的组合：</span>    <divclass="content">        <span>水果：</span>        <inputtype="checkbox" name="fruit"value="梨子"/>梨子        <inputtype="checkbox"name="fruit"value="李子"/>李子        <inputtype="checkbox"name="fruit"value="栗子"/>栗子        <inputtype="checkbox"name="fruit"value="荔枝"/>荔枝        <span>蔬菜：</span>        <inputtype="checkbox"name="vegetable"value="青菜"/>青菜        <inputtype="checkbox"name="vegetable"value="萝卜"/>萝卜        <inputtype="checkbox"name="vegetable"value="土豆"/>土豆        <inputtype="checkbox"name="vegetable" value="茄子"/>茄子    </div>           <inputtype="button"value="提交"></div>

2. Set CSS Styles

   12345

   div.box{width:300px;padding:20px;margin:20px;border:4pxdashed#ccc;}div.box span{color:#999;font-style:italic;}div.content{width:250px;margin:10px0;padding:20px;border:2pxsolid#ff6666;}input[type=‘checkbox‘]{margin:5px;}input[type=‘button‘]{height:30px;margin:10px;padding:5px10px;}

3. Writing jquery Code

   123456789101112131415

   $(function(){    // 设置属性值    $("input:button").click(function() {        varfruit = "";        varvegetable = "";        $("input:checkbox[name=‘fruit‘]:checked").each(function() {            fruit += $(this).val() + " ";        });        $("input:checkbox[name=‘vegetable‘]:checked").each(function() {            vegetable += $(this).val() + " ";        });        alert("已选择水果："+fruit+"，已选择蔬菜："+vegetable);                });})

5. Observation effect

How does jquery get the selected value based on the multiple marquee name.