JQUERY小技巧
使用任何的元字符作为名称的文本部分， 它必须被两个反斜杠转义：\\
<span id="foo[bar]"></span>
$("#foo\\[bar\\]");
jquery标签使用
$("*")匹配所有元素,多用于结合上下文来搜索。
$("form input")在给定的祖先元素下匹配所有的后代元素
$("form > input")在给定的父元素下匹配所有的子元素
$("label + input")匹配所有跟在 label 后面的 input 元素
$("form ~ input")找到所有与表单同辈的 input 元素
$('li:first'); 获取匹配的第一个元素，last最后一个元素
$("tr:even")匹配所有索引值为偶数的元素，从 0 开始计数
$("tr:odd")匹配所有索引值为奇数的元素，从 0 开始计数
$("tr:eq(1)") 匹配一个给定索引值的元素,0开始
$("tr:gt(0)") 匹配所有大于给定索引值的元素，$("tr:lt(2)")小于
<h1>Header 1</h1>$(":header")匹配如 h1, h2, h3之类的标题元素
input:focus{ } 选择获得焦点的输入字段，并设置其样式
$(":root")选择该文档的根元素，即<html>元素。
$("div:contains('John')") 查找所有包含 "John" 的 div 元素
$("td:empty")查找所有不包含子元素或者文本的空元素
$("div[id]") 查找所有含有 id 属性的 div 元素
$("input[name='newsletter']") 查找所有 name 属性是 newsletter 的 input 元素
$("input[name^='news']") 查找所有 name 以 'news' 开始的 input 元素
$("input[name$='letter']") 查找所有 name 以 'letter' 结尾的 input 元素
$("input[name*='man']") 查找所有 name 包含 'man' 的 input 元素
$("#fOutSystemSign").find("option:selected").value();查找下拉列表选中值
$("input:not(:checked)") 查找所有未选中的 input 元素
$("input:radio:checked").val();
$('input[@name="sex"][checked]').val();
$('input[name="sex"]').filter(':checked').val();
$("input[name='sex'][value=′1′]").attr("checked", true);设置选中
$("input[name=sex]:eq(0)").attr("checked", ′true′);
$('input[name="fSex"]').each(function() {判断是否被选中，并取value
if($(this).attr("checked")) {
sex = $(this).val();
}
});
$("tr[id^='tr_']").css("display","");选中以..开头的对象,<tr id="tr_prompt"></tr>
$.each($("input[name=^'classify_']:checked").not("input[name=^'classify_']:disabled"),function(i,o){
var idVal = $(o).attr("id");
var nameVal = $(o).attr("name");
var classIfyName = $(o).val();
var selectIdVal = nameVal.replace(/classify/, "studyType");
if(idVal=='yxzcbxk_48'){
studyIDStr+=","+$("#hiddenCode").val();
chooseHour += 48;
}else{
var sth = $("#"+selectIdVal).val();
var arr = sth.split("@");
if(sth==''){
$.jBox.alert("专业"+classIfyName+"，没有选择学习类型",'提示',{top: '45%', closed:function(){}});
flag = false;
return false;
}else{
studyIDStr +=","+arr[0];
chooseHour +=parseInt(arr[1],10);
choosedHour += parseInt(arr[1],10);
}
}
});
注意在不同位置调用同一方法传参的格式
<input onclick=”search(‘1’,’query’)” /> $(function(){search(1,query);}) Html=”<select id=’’ onclick=’see(\”my\”)’></select>”;//使用转义字符
url传参中文乱码（在传参页面处理）
function goSearchFullName(){ var fullName = $("#fullName").val();//机构名称注册输入文本 fullName = encodeURIComponent(fullName); //跳转到已注册机构列表显示页面,当前窗口：_self、_search，新窗口：_blank window.open("http://jxjymember.cdeledu.com/cdel_jxjy_member/groupInfo/view.do?op=goSearchFullName&fullName=" + fullName, "_self"); } }
滚动显示
//使用html标签 <MARQUEE contenteditable="true" hspace="0" vspace="0" scrollAmount=3 direction=up onstart="this.firstChild.innerHTML+=this.firstChild.innerHTML;" onmouseover="this.stop();" onmouseout="this.start();"> 滚动内容 </MARQUEE> //动画效果 <div id='payScrollObj' > <ul><li>111</li><li>222</li><li>333</li></ul> </div> function payScroll(){ $("#payScrollObj ul").animate({"margin-top":"0px"},function(){ $("#payScrollObj ul li:eq(0)").appendTo($("#payScrollObj ul")); $("#payScrollObj ul").css({"margin-top":0}); }); } //js实现：示例在文件夹中
判断浏览器，生成二维码
<script type="text/javascript" src="js/jquery.qrcode.js'/>"></script> <script type="text/javascript" src="js/qrcode.js'/>"></script> <div style="top: 275px; left: 600px;font-size: 15px;"> <div id="qrcode" ></div> </div> <script> $(document).ready(function(){ var userID="${userInfo.ID}";//用户ID var studyID="${userInfoBatchinfo.studyID}";//学习类型ID var selectStudyTypeID="${selectStudyType.id}"; var outerSystemSign = "guangdongjlcyry"; var certDate = utf16to8("${certDate}");//发证日期 //判断浏览器类型 var ua = navigator.userAgent; ua = ua.toLowerCase(); var match = /(webkit)[ \/]([\w.]+)/.exec(ua) || /(opera)(?:.*version)?[ \/]([\w.]+)/.exec(ua)|| /(msie) ([\w.]+)/.exec(ua)
||!/compatible/.test(ua) && /(mozilla)(?:.*?rv:([\w.]+))?/.exec(ua)|| []; //生成二维码 if(match[1]=="webkit"){//safari or chrome $('#qrcode').qrcode({width:90,height:90, correctLevel:0,foreground:"#3380cc",
text:"http://jxjymember.cdeledu.com/cdel_jxjy_member/selectStudyType/view.do?userID="+userID +"&studyID="+studyID +"&selectStudyTypeID="+selectStudyTypeID +"&outerSystemSign="+outerSystemSign +"&certDate="+certDate +"&op=codeInfomation"}); }else{ $('#qrcode').qrcode({width:90,height:90, correctLevel:0,foreground:"#3380cc",render:"table", text:"http://jxjymember.cdeledu.com/cdel_jxjy_member/selectStudyType/view.do?userID="+userID +"&studyID="+studyID +"&selectStudyTypeID="+selectStudyTypeID +"&outerSystemSign="+outerSystemSign +"&certDate="+certDate +"&op=codeInfomation"}); } }); //把字符串转换成UTF-8 function utf16to8(str) { var out, i, len, c; out = ""; len = str.length; for(i = 0; i < len; i++) { c = str.charCodeAt(i); if ((c >= 0x0001) && (c <= 0x007F)) { out += str.charAt(i); } else if (c > 0x07FF) { out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F)); out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F)); out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); } else { out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F)); out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); } } return out; } </script>
获取鼠标位置显示div
$('#failLogin').hover(function(){
$("#loginText").css("display","block")
.css("top",(event.clientY+25)+"px")
.css("left",(event.clientX-30)+"px")
.css("position","absolute");
});
保留小数后2位
// 强制保留2位小数，不足补全 function toDecimal2(x) { var f = parseFloat(x); if (isNaN(f)) { return false; } var f = Math.round(x*100)/100; var s = f.toString(); var rs = s.indexOf('.'); if (rs < 0) { rs = s.length; s += '.'; } while (s.length <= rs + 2) { s += '0'; } return s; } // toFixed() <script> var num=22.127456; alert( num.toFixed(2)); alert(parseFloat(50).toFixed(2);); //50.00 </script> // substring function get(){ var s = 22.127456 + ""; var str = s.substring(0,s.indexOf(".") + 3); alert(str); } // 正则 <script type="text/javascript"> onload = function(){ var a = "23.456322"; var aNew; var re = /([0-9]+\.[0-9]{2})[0-9]*/; aNew = a.replace(re,"$1"); alert(aNew); } </script> // (…*100)/100 <script> var num=22.127456; alert( Math.round(num*100)/100); </script>
去掉拼接后的最后一个‘，’
payBillIDStr += $(this).val()+','; payBillIDStr=payBillIDStr.substr(0,payBillIDStr.lastIndexOf(","));
防止重复提交
$("#addSubmit").on("click", function () {
$(this).attr("disabled","disabled");
//防止重复提交
var checkSubmitFlag =layer.msg('正在保存，请稍等...', {
icon: 16,
shade: 0.4,
time:false //取消自动关闭
});
var options = {
url: _ctx + "/pro/proproduct/add.do",
type: "post",
resetForm: true,// 提交后重置表单
dataType: 'json',
data:{
minidaysnum : $("#minidaysnum").val()
},
beforeSubmit: function (formData, jqForm, options) {
//重置验证
jqForm.data("bootstrapValidator").resetForm();
// 手动触发验证
var bootstrapValidator = jqForm.data('bootstrapValidator');
bootstrapValidator.validate();
if (!bootstrapValidator.isValid()) {
return false;
}
formData.push({name:"templateid",value: $("#templateid").val()})
},
success: function (data, statusText) {
if (data != undefined) {
if (data.success) {
layer.close(checkSubmitFlag);//手动关闭
layer.msg('添加成功!', {icon: 1});
$(this).removeAttr("disabled");
loadUrl('/admin/system/proproductlist')
} else {
layer.msg(data.msg, {icon: 2});
}
}
}
};
$("#form").ajaxSubmit(options);
});
获取验证码，显示倒计时
function update_p(num,t) { if(num == t) { $("#getCode").text("重新发送"); $("#getCode").attr("disabled",false); }else { printnr = t-num; // $("#getCode").css("font-size","12px"); $("#getCode").text(printnr +"秒重新发送"); } } function showtime(t) { var phone = $("#phone").val(); $.ajax({ type: "post", url: _ctx + "/app/interface/sendCode", async: false, cache: false, data: {telephone: phone}, dataType: "json", success: function (data) { if (data != undefined) { if (data.success) { $("#getCode").attr("disabled", true);//获取验证码按钮不可编辑 for (i = 1; i <= t; i++) { window.setTimeout("update_p(" + i + "," + t + ")", i * 1000); } popTxt("发送成功"); } else { popTxt("发送失败，请稍后再试"); } } }, error: function (e) {} }); }
遍历后台数组参数
后台： List list = selectStudyTypeFacade.getStudyTypeList(selectStudyType); JSONArray json = JSONArray.fromObject(list); request.setAttribute("json ", json.toString()); 前端： $(document).ready(function(){ var json = "${json}"; for(var i=0,l=json.length;i<l;i++){ for(var key in json[i]){ if(key=="studyID"){ alert(key+':'+json[i][key]); } if(key=="studyName"){ alert(key+':'+json[i][key]); } } } });
