总结自己在工作中遇到过的常用js

1:当选中的多选框变化时的jq表达

$("input[name='years[]']:checkbox").on('change',function () {
});

2:让被选中的的多选框进行循环

$("input[name='years[]']:checkbox:checked").each(function(){
});

3:让变量余2个小数点

total_money.toFixed(2)

4:from表单jq提交的两种方式

a)$(".pay").click(function(){
 $("#payfrom").submit();//#payfrom是from表单的id
 });
 b)$(".pay").click(function(){
 document.searchForm.action='{:U(addcat)}';//searchForm为from的name值
 });

5:只取整数的函数:parseInt();
6:获取某个ul下的li个数:$(".bd li").length;
7:获取标签的id值:var id = $(this).attr("id");
8:获取标签的data-id="{$row['cid']}"值:var id= $(this).data("id");
9:ajax的写法

$.ajax({
 type: 'POST',
 url: "{:U('Goods/cart')}",
 data:{"cid":id,"type":type},
 success: function(data){
 //console.log(data);
 js();
 },
 });

10:去除标签的checked选中值:$("#"+bb).attr("checked",false);
11:是否给标签加禁用属性:$("#lijig").attr('disabled',true);//falst是禁用
12:页面一加载完毕就执行的的函数:

$(document).ready(function(){
 // 更新商品价格
 get_goods_price();
 });

13:ceil() 方法可对一个数进行上舍入。

14:在指定标签后结尾插入内容:$(".ajax_return").append(data);
15:当按下按键时，改变文本域的颜色：//keyup

$("input").keyup(function(){
 $("input").css("background-color","#D6D6FF");
 });

16:当输入域失去焦点 (blur) 时改变其颜色：

$("input").blur(function(){
 $("input").css("background-color","#D6D6FF");
 });

ps:获取焦点$("#err_phone").focus();
17:jq添加form提交地址

document.searchForm.action='{:U("Cart/order1")}';//searchForm是form的name名

18:删除HTML元素

remove() - 删除被选元素（及其子元素）
empty() - 从被选元素中删除子元素

19:layer弹出层强制关闭

layer.closeAll();

window.parent.location.reload();//让打开这个窗口的父窗口刷新，然后本子窗口关闭！;layer弹出加载页,操作后返回时关闭弹出层

在子页面里关闭父窗口
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);

20:判断是本地(localhost)还是线上(.com)

//判断是本地(localhost)还是线上(.com)返回url
function getURL() {
    var strPath = window.document.location.pathname;
    var postPath = strPath.substring(0, strPath.substr(1).indexOf('/') + 1);// 取得文件根目录
    var arr = ["com","xyz","net","top","tech","org","gov","edu","cn","tv"];
    var url = 'http://'+document.domain; 
    for (var i = 0; i < arr.length; i++) {
        if (url.indexOf(arr[i])>-1){
            return url; 
        } else {  
            return (url + postPath);  
        }  
    }        
}

21:jq添加删除修改class名
参考地址

一个标签可以指定多个class
1.         增加一个class：

   $(".default").addClass("hover_s");

2.         移除一个class：

  $(".default").removeClass("default ");

3.         修改一个class：

3.1   可以分两步走：

   1 先增加一个你要增加的class

  $(".default").addClass("hover_s");

 

2 再删除一个你想要删除的class

  $(".default").removeClass("default ");

 

   或者反过来，先删除，后增加也行。

3.2   可以直接设置成你想要的class

   $(". default ").attr("class", " hover_s fl fv lv ");

4.         当鼠标移到，离开指定标签时修改class

   移到时改成hover_s，离开时改成default

   $(".default").hover(function () {

   $(this).addClass("hover_s");

   $(this).removeClass("default");

   }, function () {

   $(this).addClass("default");

   $(this).removeClass("hover_s");

   });

5.         获取标签的所有class

   var classname_module = $(".lv").attr("class");

22:获取单选被选中值

$('input:radio[name="sex"]:checked').val();

23:thinkphp下U方法传参

window.location.href="{:U('controller/view')}?text="+text;

在JavaScript中有三种声明变量的方式：var、let、const
参考链接
1.const 声明创建一个只读的常量。这不意味着常量指向的值不可变，而是变量标识符的值只能赋值一次，必须初始化。

const b = 2;//正确
// const b;//错误，必须初始化
console.log(‘函数外const定义b：’ + b);//有输出值
// b = 5;
// console.log(‘函数外修改const定义b：’ + b);//无法输出

2.var 语句用于声明变量。
var a; //undefined (如果不初始化，输出undefined)
var a=666; //放到方法外面为全局变量
function fun(){
//var a=555; //放到方法内部为局部变量，只能在fun()内部读取
　　console.log(a); //666
}
如果不实用var 关键词，无论放到方法内还是方法外都是全局变量，所以var 会影响变量作用域。

3.let是块级作用域，函数内部使用let定义后，对函数外部无影响。
ES6新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。即声明一个局部变量。
以for循环为例：
下面的代码如果使用var，最后输出的是10。
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a6; // 10
上面代码中，变量i是var声明的，在全局范围内都有效。所以每一次循环，新的i值都会覆盖旧值，导致最后输出的是最后一轮的i的值。（常见于闭包的考察）
如果使用let，声明的变量仅在块级作用域内有效，最后输出的是6。
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a6; // 6

上面代码中，变量i是let声明的，当前的i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量，所以最后输出的是6。

a 标签的download 属性来进行下载下载的文件名为download里的内容

<foreach name="data.attachment" item="v">
<li class="o">
    <a style="color:#959595;" href="{$v.path}" download="{$v.name}" data-name="{$v.name}" class="fr">下载</a>
    <a style="color:#959595;" href="{$v.path}" download="{$v.name}" data-name="{$v.name}" class="fl ts300">{$v.name}</a>
</li>
</foreach>

<ul class="ziZhilist">
    <foreach name="data.attachment" item="v">
    <li class="o">
        <a href="javascript:;" style="color:#959595;" data-href="{$v.path}" data-name="{$v.name}" class="fr">下载</a>
        <a href="javascript:;" style="color:#959595;" data-href="{$v.path}" data-name="{$v.name}" class="fl ts300">{$v.name}</a>
    </li>
    </foreach> 
</ul>
<script type="text/javascript">
(function(){
var hostUrl = "http://"+"<?php echo $_SERVER['HTTP_HOST']; ?>";
$("ul.ziZhilist li").find("a").click(function(){
    var link = document.createElement('a');
    link.setAttribute("download",$(this).attr("data-name"));
    link.href = hostUrl+$(this).attr("data-href");
    link.click(); 
});
})();
</script>

input 获取name相同的值

$(".input-k").map(function(){return this.value}).get().join(',');

获取form表单的值(多用于post提交)

$('#show-form2').serializeArray();

jq跳转

window.location.href = "网址";

用jquery获取select标签中选中的option值及文本

				alert($("#sel option:selected").text());//方法一：获取select标签选中的option中的文本。
                alert($("#sel").find("option:selected").text());//方法二：获取select标签选中的option中的文本。
                 
                alert($("#sel option:selected").val());//方法一：获取select标签选中的option中的value的值。
                alert($("#sel").find("option:selected").val());//方法二：获取select标签选中的option中的value的值。
                //------------------------------帅气的分割线，，下面有重点--------------------------------
                 
                //当option是这样的：<option>cc</option>。即没有value属性的时候。自然也就没有value值。
                //这时候jquery就很纠结：写了段代码让我拿value的值，可是找到的option中根本没有value属性。
                //算了，把option中 的文本拿出来给你吧。
                //所以当选中<option>cc</option>这个option的时候，你会发现上边四个alert出来的值是一样的。都是option中的文本。
                //想要拿到option中的value的值，首先option得有value属性啊！！！

js和jquery获取textarea输入的内容

document.getElementById('textarea').value;
$("#textarea").val()

					<select id="myYear" class="d3-ss-input">
                        <option value="" style="display: none;" disabled selected>请选择年份</option>
                    </select>
//select只显示年份
    var myDate= new Date();
    var startYear=myDate.getFullYear()-50;//起始年份
    var endYear=myDate.getFullYear()+50;//结束年份
    var obj=document.getElementById('myYear')
    for (var i=startYear;i<=endYear;i++)
    {
        obj.options.add(new Option(i,i));
    }
    // obj.options[obj.options.length-51].selected=1;//默认当前年

让标签按钮只点击一次

$(".receive-btn").one('click',function(e){
});

解析一个json字符串

jQuery.parseJSON();
//$.parseJSON() 函数用于将符合标准格式的的JSON字符串转为与之对应的JavaScript对象。
//注意：传入格式有误的 JSON 字符串可能导致抛出异常。例如，下面这些无效的 JSON 字符串：
$(function () { 
    var obj = jQuery.parseJSON('{"name":"John"}');
    alert( obj.name === "John" );
})

倒计时

	$(".collection_time").each(function () {
        var classname = $(this).attr("data-id");
        var starttime = parseInt($(this).text());
        TimeDown(classname, starttime);
    });

    function TimeDown(classname, starttime) {
        var nowtime = parseInt(new Date() / 1000);
        var time = starttime - nowtime;
        var day = parseInt(time / 60 / 60 / 24);
        var hour = parseInt(time / 60 / 60 % 24);
        var minute = parseInt(time / 60 % 60);
        var seconds = parseInt(time % 60);
        var html = day + "天" + hour + "小时" + minute + "分钟" + seconds + "秒";
        $("." + classname).html(html);
        if (day == 0 && hour == "00" && minute == "00" && parseInt(seconds) - 1 < 0) {
            location.reload();
        } else {
            setTimeout(function () {
                TimeDown(classname, starttime);
            }, 1000)
        }
    }

如何让光标默认显示在input里面？

document.getElementById("d").focus();
$("#aa").focus();

js监控本页面是否是后退返回的

window.addEventListener('pageshow', function (event) {
        if (event.persisted || window.performance && window.performance.navigation.type == 2) {
            console.log('window.performance.navigation.type: ' + window.performance.navigation.type);
            // alert("监听到是点击返回按钮进入本页的了")
            location.reload();
        }
    }, false);

网页如何禁止鼠标右键和F12,键盘另存为、粘贴、复制事件

禁止鼠标右键事件
js

document.oncontextmenu = function(){
        return false;
    }

jq

$(function(){
        $(document).contextmenu(function() {
            return false
        })
    });

禁止F12事件
js

window.onload = function(){
            document.onkeydown = function(event){
                var ev = event || window.event || arguments.callee.caller.arguments[0];
                //123 代表F12键
                if(event.keyCode = 123){
                    return false;
                }
            }
        }

禁止F12事件，键盘的选择粘贴复制事件
jq

function forbidKeyboard() {
        $(document).keydown(function(e) {
            /*9:Tab键, 17：Control键, 18:Alt键, 123:F12键, 83:S键*/
            var keyboardCode = [9, 17, 18, 123];
            for (i in keyboardCode) {
                if (keyboardCode[i] == e.keyCode) {
                    return false;
                }
            }
            if ((e.keyCode == 83) && (e.ctrlKey || e.metaKey)) {
                return false;
            }
        });
        /*禁止文本选择功能*/
        $(document).bind("selectstart",function(){return false;});
    }
    $(function(){
        forbidKeyboard();
    });

jq把tp7的数组转正jq能用的函数

 var arr = JSON.parse('{:json_encode($arr)}');

查看某一js的版本号
version

微信分享解决特殊符号转换成html 实体的问题
页面js
注意点：分享的代码加在详情页的上面也就是后紧随分享代码，解决界面加载慢分享标题图片不出现问题

    var titleText = decodeHtml("{$title}");
    var descText = decodeHtml("{$contentShare}");
    wx.ready(function () {
        wx.updateAppMessageShareData({
            title: titleText,
            desc: descText,
            link: "{$url}",
            imgUrl: "{$imgUrl}",
            fail: function (res) {
                console.log(res);
            }
        });
        wx.hideMenuItems({
            menuList: ['menuItem:share:timeline', 'menuItem:share:qq', 'menuItem:share:weiboApp', 'menuItem:share:facebook', 'menuItem:share:QZone'] // 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有 menu 项见附录3});
        });
    });
function decodeHtml(html) {
        var txt = document.createElement("textarea");
        txt.innerHTML = html;
        return txt.value;
    }

PHP方面也可配合html_entity_decode函数转回实体

html_entity_decode($article['contentShare']);

身份证号码的正则表达式可以根据不同的国家和地区而有所不同。以下是中国大陆身份证号码的正则表达式：

/^[1-9]\d{5}(19\d{2}|20[01]\d)(0[1-9]|1[0-2])(0[1-9]|[1-2]\d|3[0-1])\d{3}[\dX]$/

该正则表达式的含义是：

第一位必须是非零数字；
接下来的5位数字可以是任意数字；
第7-10位表示出生年份，必须是1900年到2019年或2000年到2021年；
第11-12位表示出生月份，必须是01到12；
第13-14位表示出生日期，必须是01到31；
第15-17位是顺序号，可以是任意数字；
最后一位是校验码，可以是数字0到9或字母X。
如果需要匹配其他国家或地区的身份证号码，可以根据其规则进行相应的修改。