如何在jqgrid中设置checkbox多选，如何获取多选的值

在你的jgGrid定义中增加下面这个

multiselect: true,

onSelectRow: function (rowId, status, e) {

var rowIds = jQuery("#table1")jqGrid('getGridParam', 'selarrrow');

},

思路：首先利用name属性值获取checkbox对象，然后循环判断checked属性：如果为true表示被选中，false则表示未选中。

实例演示如下：

1、HTML结构

<input type="checkbox" name="test" value="1"/><span>1</span>

<input type="checkbox" name="test" value="2"/><span>2</span>

<input type="checkbox" name="test" value="3"/><span>3</span>

<input type="checkbox" name="test" value="4"/><span>4</span>

<input type="checkbox" name="test" value="5"/><span>5</span>

<input type='button' value='提交' onclick="fun()"/>

2、javascript代码

function fun(){

    obj = documentgetElementsByName("test");

    check_val = [];

    for(k in obj){

        if(obj[k]checked)

            check_valpush(obj[k]value);

    }

    alert(check_val);

}

3、演示效果

根据多选框name来获得选中的值可用如下 jquery代码实现

$("input:checkbox[name='test']:checked")each(function() { // 遍历name=test的多选框

  $(this)val();  // 每一个被选中项的值

});

实例演示：给出两组多选框，点击按钮后分别获得两组中被选择的项目

示例代码如下

创建Html元素

<div class="box">

<span>请输入用户名，限定字母、数字或下划线的组合：</span><br>

<div class="content">

<span>水果：</span><br>

<input type="checkbox" name="fruit" value="梨子"/>梨子

<input type="checkbox" name="fruit" value="李子"/>李子

<input type="checkbox" name="fruit" value="栗子"/>栗子

<input type="checkbox" name="fruit" value="荔枝"/>荔枝<br>

<span>蔬菜：</span><br>

<input type="checkbox" name="vegetable" value="青菜"/>青菜

<input type="checkbox" name="vegetable" value="萝卜"/>萝卜

<input type="checkbox" name="vegetable" value="土豆"/>土豆

<input type="checkbox" name="vegetable" value="茄子"/>茄子

</div>

<input type="button" value="提交">

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

input[type='checkbox']{margin:5px;}

input[type='button']{height:30px;margin:10px;padding:5px 10px;}

编写jquery代码

$(function(){

// 设置属性值

$("input:button")click(function() {

var fruit = "";

var vegetable = "";

$("input:checkbox[name='fruit']:checked")each(function() {

fruit += $(this)val() + " ";

});

$("input:checkbox[name='vegetable']:checked")each(function() {

vegetable += $(this)val() + " ";

});

alert("已选择水果："+fruit+"，已选择蔬菜："+vegetable);

});

})

观察效果

以上就是关于如何在jqgrid中设置checkbox多选，如何获取多选的值全部的内容，包括:如何在jqgrid中设置checkbox多选，如何获取多选的值、如何用js读取复选框的值、jquery如何根据多选框name来获得选中的值。等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！