checked js 获取值_JS----checked----checked选中和未选中的获取
全选、全不选、反选功能
html代码
篮球
足球
排球
网球
壁球
乒乓球
羽毛球
JS代码function setVal(iNum){
var aForm = document.getElementById("myForm");
var aArr = aForm.hobby;
for(var i=0;i
if( iNum<0 ){
aArr[i].checked = !aArr[i].checked;
}else{
aArr[i].checked = iNum;
}
}
}
设置选中下边两种写法没有任何区别 只是少了些代码而已
jquery赋值checked的几种写法:
所有的jquery版本都可以这样赋值:
// $("#cb1").attr("checked","checked");
// $("#cb1").attr("checked",true);
jquery1.6+:prop的4种赋值:
// $("#cb1").prop("checked",true);//很简单就不说了哦
// $("#cb1").prop({checked:true}); //map键值对
// $("#cb1").prop("checked",function(){
return true;//函数返回true或false
});
//$("#cb1").prop("checked","checked");
为什么input checkbox有 checked='checked'还是没选中
如果用jQuery1.6+来写的话：
建议使用
$(element).prop('checked', true/false);
而不是
$(element).attr('checked', true/false);
其实也就相当于要使用：
element.checked = true/false;
而并不是
element.setAttribute('checked', true/false/'checked');
jquery判断checked的三种方法.attr('checked'): //看版本1.6+返回:"checked"或"undefined" ;1.5-返回:true或false.prop('checked'): //16+:true/false.is(':checked'): //所有版本:true/false//别忘记冒号哦
jQuery获取未选中的checkbox$('input[type=checkbox]').not("input:checked");
jQuery获取选中的checkbox$('input[type=checkbox]:checked');
jquery官网checked的用法http://api.jquery.com/checked-selector/
DataTable翻页checked部分代码
内容太多需要勾选时，我们需要做翻页，但是翻页要记录之前的页面勾选了哪些，需要借助input来记录。html代码如下:
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
参考文献 保 存
class="table table-striped table-bordered responsive table-hover"
id="table" cellspacing="0" width="100%">
期刊名标题作者摘要引用
$(function(){
var checkedIdsOld = "${ item.id }|";
$("#checkList").val(checkedIdsOld);
refreshTable();
bindCheckListChange();
$('#btnSave').click(function(){
$(this).button('loading');
var allValue = $("#checkList").val();
allValue = allValue.substring(0, allValue.length - 1);
allValue = allValue.replace(/[ ]/g, "");
var checkedIds = allValue.split("|");
console.log(checkedIds);
$.postJSON('/docAssociate',
checkedIds,
function(res){
$('#btnSave').button('reset');
location.href = '/test}'
if(!res.code){
alert('保存失败');
}
}
);
});
});
function bindCheckListChange(){
$('#table').on('change','.checkbox',function(){
var allValue = $("#checkList").val();
if (typeof($(this).attr("checked")) == "undefined") {
//改变前是 未选中,则变为选中,把值增加到checkList中
$(this).attr("checked", 'true');
if (!contains(allValue, $(this).attr("value"), false)) {
allValue += $(this).attr("value") + "|";
$("#checkList").val(allValue);
console.log(allValue);
}
} else {
//改变前是选中,则变为未选中,把值从checkList中删除
$(this).removeAttr("checked");
if (contains(allValue, $(this).attr("value"), false)) {
var rstr = $(this).attr("value") + "|";
allValue = allValue.replace(rstr, "");
$("#checkList").val(allValue);
console.log(allValue);
}
}
})
}
function refreshTable(){
$('#table')
.DataTable(
{
responsive : true,
lengthChange : false,
serverSide : true,//分页，取数据等等的都放到服务端去
stateSave : true,
searching : false,
processing : true,//载入数据的时候是否显示“载入中”
bDestroy : true,
pageLength : 2,//首次加载的数据条数
ordering : false,//排序操作在服务端进行，所以可以关了。
language : {
processing : "载入中",//处理页面数据的时候的显示
paginate : {//分页的样式文本内容。
previous : "上一页",
next : "下一页",
first : "第一页",
last : "最后一页"
},
zeroRecords : "没有内容",//table tbody内容为空时，tbody的内容。
//下面三者构成了总体的左下角的内容。
info : "第 _PAGE_/_PAGES_页 共 _TOTAL_条记录",//左下角的信息显示，大写的词为关键字。
infoEmpty : "第 _PAGE_/_PAGES_页 共 _TOTAL_条记录",//筛选为空时左下角的显示。
infoFiltered : ""//筛选之后的左下角筛选提示(另一个是分页信息显示，在上面的info中已经设置，所以可以不显示)，
},
"columnDefs" : [ {
"defaultContent" : "",
"targets" : "_all"
} ],
"ajax" : {//类似jquery的ajax参数，基本都可以用。
type : "post",//后台指定了方式，默认get，外加datatable默认构造的参数很长，有可能超过get的最大长度。
url : "/referenceDocument/listData",
dataSrc : "data",//默认data，也可以写其他的，格式化table的时候取里面的数据
data : function(d) {//d 是原始的发送给服务器的数据，默认很长。
var param = {};//因为服务端排序，可以新建一个参数对象
param.start = d.start;//开始的序号
param.length = d.length;//要取的数据的
var formData = $("#search_form")
.serializeArray();//把form里面的数据序列化成数组
formData.forEach(function(e) {
param[e.name] = e.value;
});
return param;//自定义需要传递的参数。
}
},
"columns" : [
{
"data" : "author",
"class" : "text-center"
},
{
"data" : "title",
"class" : "text-center",
},
{
"data" : "name",
"class" : "text-center",
},
{
"data" : "summary",
"class" : "text-center",
},
{
"class": "text-center",
"render": function(data, type, row, position) {
var allValue = $("#checkList").val();
allValue = allValue.substring(0, allValue.length - 1);
allValue = allValue.replace(/[ ]/g, "");
var checkedIds = allValue.split("|");
return ' -1 ? 'checked="checked"' : '') + '">';
}
}
]
});
}
/**
*string:原始字符串
*substr:子字符串
*isIgnoreCase:忽略大小写
*/
function contains(string, substr, isIgnoreCase){
if (isIgnoreCase) {
string = string.toLowerCase();
substr = substr.toLowerCase();
}
var startChar = substr.substring(0, 1);
var strLen = substr.length;
for (var j = 0; j < string.length - strLen + 1; j++) {
if (string.charAt(j) == startChar) //如果匹配起始字符,开始查找
{
if (string.substring(j, j + strLen) == substr) //如果从j开始的字符与str匹配，那ok
{
return true;
}
}
}
return false;
}
/**
* like $.getJSON, Load JSON-encoded data from the server using a POST HTTP
* request.
*/
$.postJSON = function(url, data, fnSuccess, fnError) {
$.ajax({
url: url,
type: "POST",
dataType: "json",
cache: false,
contentType: "application/json",
data: JSON.stringify(data),
success: function(result) {
fnSuccess && (fnSuccess(result) || 1) || (typeof result.code != 'undefined' && !result.code && tip(result.error || '更新失败...'));
},
error: function(err) {
if (err.status == 401) {
return tip(err.status + ' ' + err.statusText + ', 当前会话已失效，请去新窗口 登陆 后继续操作!', 60000);
}
fnError && (fnError.apply($, Array.prototype.slice.call(arguments)) || 1) || tip(err.status + ' ' + err.statusText);
}
});
};