当都选其中某几项时,如果需要给服务端ajax传递对应项的id值,该如何做呢?
思路应该是这样的:
①获取被勾选项(即checked的checkbox所在行)
②将id存在checkbox所在input的自定义属性中,如data-id
中
③创建空数组,遍历被选中的checkbox所在行,获取对应的data-id
值,存入数组中
④将存入的数组转化为字符串,并用逗号隔开(join(','))
html代码如下:
<table id="list-table"> <thead> <tr> <th><div></div></th> <th><div>ID</div></th> <th><div>数据集</div></th> <th><div>数据集简介</div></th> <th><div>倒入时间</div></th> </tr> </thead> <tbody> <tr> <td><input type="checkbox" name="dataset-id" value="1" data-id="1"></td> <td>1</td> <td>GWC9B2015</td> <td>2015年平均值数据</td> <td>2017-05-23T15:43:58.020</td> </tr> <tr> <td><input type="checkbox" name="dataset-id" value="2" data-id="2"></td> <td>2</td> <td>GWC9A2015</td> <td>2015年平均值数据2</td> <td>2017-05-24T14:40:33.441</td> </tr> <tr> <td><input type="checkbox" name="dataset-id" value="8" data-id="8"></td> <td>8</td> <td>cma_1km_stat</td> <td>2015年1公里风数据</td> <td>2017-05-24T16:12:12.620</td> </tr> </tbody> </table>
JQ代码
var $ids = []; //定义一个空数组 var $chkBoxes = $('#idc-list-table').find('input:checked'); //找到被选中的checkbox集 if ($chkBoxes.length == 0) { //如果不勾选弹出警告框 alert('请至少选择一个数据集'); return false; } //遍历被选中的checkbox集 $($chkBoxes).each(function () { $ids.push( $(this).attr('data-id') ); //找到对应checkbox中data-id属性值,然后push给空数组$ids }); var $ids_str = $ids.join(','); //将数组转化为用逗号隔开的字符串 //( 还有一种写法:var $ids_str += ','+($ids + '') ) ,Number型加上空字符串''可以将Number转化为字符串 console.log($ids_str); // =>1,2
发表评论: