zoukankan      html  css  js  c++  java

  • 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({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({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]);
            }
        }
     }
});

     

     

     

     

     
  • 相关阅读:
    跟着百度学PHP[6]超级全局变量
    DuBrute 3.1
    第三方提权之serv-u提权
    报错注入分析之Extractvalue分析
    报错注入分析之updatexml注入
    B/S与C/S架构
    Python IDLE背景设置与使用
    调试软件的基本方法
    Windows10下安装python（配置环境变量）
    磁盘分区
  • 原文地址：https://www.cnblogs.com/whatarewords/p/10716686.html
Copyright © 2011-2022 走看看