博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【知识碎片】JavaScript篇
阅读量:5173 次
发布时间:2019-06-13

本文共 9034 字,大约阅读时间需要 30 分钟。

 40、选择器组合

逗号是多选择器

空格 是子子孙孙
尖括号 只找儿子

39、失去焦点事件blur

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

 

38、图片延迟加载

Lozad.js  

jQuery.lazyload

demo:https://apoorv.pro/lozad.js/demo/

37、纯JS复制文本到检测板  

clipboard.js

官网:https://clipboardjs.com/

GIT:https://github.com/zenorocha/clipboard.js/archive/master.zip

36、二维码JS库

https://github.com/xiaoshi657/qrcodejs

 

35、jquery中ifram子窗体调用父窗体方法、父窗体调用子窗体方法

//调用子窗体中的方法. var childWindow = $("#AddFrame")[0].contentWindow;//获取子窗体的window对象 childWindow.subForm(); //调用父窗体中的方法  window.parent.afterAdd();

 

34、省市联动 遍历json数组

//地址改变事件    $("#ProvinceCode").change(function (e) {        $.ajax({            type: "POST",            url: "/usercenter/uaccount/getcitylist",            data: {provinceCode:$("#ProvinceCode").val()},            success: function (result) {                //result :[{"ID":127,"Code":"360100","Name":"南昌市","ProvinceCode":"360000"},{"ID":128,"Code":"360200","Name":"景德镇市","ProvinceCode":"360000"}]                var tempHtml="";                for (var i in result) {                    tempHtml+='';                }                $("#CityCode").html(tempHtml);            },            dataTypeString: "json"        });
View Code

 

c#代码:

public ActionResult GetCityList(string provinceCode)        {            List
cityList = CacheHelper.GetCache("CityCache") as List
; if (cityList == null) { XS.EasyBlog.BLL.S_CityService citybll = new BLL.S_CityService(); cityList = citybll.LoadEntities(c => true).ToList(); CacheHelper.SetCache("CityCache", cityList); } cityList = cityList.Where(c => c.ProvinceCode == provinceCode).ToList(); //ViewBag.CityList = cityList; return Json(cityList, JsonRequestBehavior.AllowGet); //return View(CurrentMember); }
View Code

 

33、获取form表单所有值

$("#commitInfoForm").click(function () {        alert($("#accountInfoForm").serialize());//.serializeArray();    });

键值对:

$("button").click(function(){  x=$("form").serializeArray();  $.each(x, function(i, field){    $("#results").append(field.name + ":" + field.value + " ");  });});

 

32、json转换

var obj = eval('(' + str + ')');var last=JSON.stringify(obj); //将JSON对象转化为string字符

31、IE8屏蔽错误

重写方法

window.onerror = function () { return true; }    console.log = function () { };    console.error = function () { };

 

 

30、jqzoom.js 图片放大器

SWFUpload 文件上传

29、数组中存在则移除

AddMemberIDList.splice($.inArray(MemberID, AddMemberIDList), 1);//1:移除的次数这里指一次  0:不移除

28、可以关闭的小广告

var dvObj = $('
').appendTo($('body')); //层来了 //可以关闭广告 $('×').click(function () { $(this).parent().remove(); }).appendTo(dvObj);

27、请仔细阅读协议

$(function () {            var sec = 5;            var setId = setInterval(function () {                sec--;                if (sec <= 0) {                    sec = 0; clearInterval(setId); $('#btn').val('同意').attr('disabled',false); } else { $('#btn').val('请仔细阅读协议(' + sec + ')'); } }, 1000); });

26、jq的cookie处理 jquery.cookie.js

1、引用  jquery.cookie.js

2、用下面这段代码   两个方式都很好用

//写cookiesfunction setCookie(name, value,time) {    var Days = time||365;    var exp = new Date();        exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);        document.cookie=name+"="+escape(value)+";expires="+exp.toGMTString()+";path=/;";}//读取cookiesfunction getCookie(sName) {    var aCookie = document.cookie.split("; ");    for (var i = 0; i < aCookie.length; i++) {        var aCrumb = aCookie[i].split("=");        if (sName == aCrumb[0])            return unescape(aCrumb[1]);    }    return null;}//删除cookiesfunction delCookie(name) {    var exp = new Date();    exp.setTime(exp.getTime() + -1 * 24 * 60 * 60 * 1000);    var cval = getCookie(name);    if (cval != null)        document.cookie = name + "=;expires=" + exp.toGMTString() + "; path=/;";}//清楚所有cookiefunction clareCookie() {    var strCookie = document.cookie;    var arrCookie = strCookie.split("; "); // 将多cookie切割为多个名/值对    for (var i = 0; i < arrCookie.length; i++) { // 遍历cookie数组,处理每个cookie对        var arr = arrCookie[i].split("=");        if (arr.length > 0)            delCookie(arr[0]);    }}
View Code

 

//创建一个超链接添加到body中                 $('').text('百度').appendTo($('body'));                //在body中添加超链接               // var akObj = $('').text('百度');               // $('body').append(akObj);

 

//表示的是包含哈哈这两个字的内容的层                //$('div:contains(哈哈)').css('fontSize','100px');                //空层                //$('div:empty').css('backgroundColor', 'pink');                //所有DIV中包含a标签的div北京为蓝色                $('div:has(a)').css('backgroundColor', 'pink');

 

25、循环遍历checkbox /radio

                    
吃饭
睡觉
打豆豆
打篮球
打足球
打铅球
View Code

 

                            
忐忑
法海不懂爱
金箍棒
爱情买卖
最炫民族风
View Code

 

    
Title
选项 IP PORT
1.1.1.1 80
1.1.1.1 80
1.1.1.1 80
View Code

 

24、获取被选中的checked  input

$('input:checked').css('backgroundColor', 'red');//获取 被选中的元素
吃饭
睡觉
打豆豆

 

23、两个加载的区别onload

onload $(document).ready(function (){}) 区别

前者是图片类资源都加载完执行

或者是基本标签加载完执行

前者只可以写一个,多写后面的会覆盖前面的,后者写多少个执行多少个

后者的终极写法

$(function (){})$(document).ready(function (){})//与$(function (){})//功能一样都是加载完执行

 

 

 

22、JS正则

var patt1=new RegExp("e");document.write(patt1.test("The best things in life are free"));//返回true //RegExp 对象有 3 个方法:test()、exec() 以及 compile()//返回bool、返回匹配到的字符
var msg= "      去掉空格      " msg = msg.replace(/^\s+/g, '');// \s空格

正则表达式中/i,/g,/ig,/gi,/m的区别和含义

/i (忽略大小写)

/g (全文查找出现的所有匹配字符)
/m (多行查找)
/gi(全文查找、忽略大小写)
/ig(全文查找、忽略大小写)

21、js 随机数 整数

$(document).ready(function() {       //x上限,y下限           var x = 12;            var y = 0;              var rand = parseInt(Math.random() * (x - y + 1) + y);              $("#b").html("").append("
" + rand + "
"); })

 

 从1开始 至 任意值    

 

parseInt(Math.random()*上限+1);   

 

2. 从任意值开始 至 任意值  

 

parseInt(Math.random()*(上限-下限+1)+下限);   

 

random是0到1之间(不包括1)的伪随机函数,floor是取当前数值的整数部分值,舍掉小数部分.

常搭配使用,用来取0到某个数值之间的随机数.如想取0~49之间的随机数可用:

Math.floor(Math.random()*50),最大值再大也不到50,后舍掉小数部分就是0~49的任意一个伪随机数.

round是取近似值的数,也就是四舍五入的说法.返回一个整数值,配合使用如:

Math.round(Math.atan2(y,x))来返回一个角度的近似整数值

 

20、判断是否为空

**判断是否null*@param data*/function isNull(data) {    return (data == "" || data == undefined || data == null);}

var companyid = new URL().get('CompanyID');

if (companyid != null || companyid != "" || companyid != undefined) {

 

 

19、去掉最后逗号

chk_id = chk_id.substr(0, chk_id.length - 1);//去掉最后“,”

 

18、去掉html

$("#" + id).parent().parent().remove();

17、setInterval(循环) setTimeout(一次)定时执行

//--------监测UUID  start-------    //每0.1秒检查一次字符串前34个字符是否等于tvalue如果不等于就重新赋值,    var tValue = "4F9863FE-96DA-4AB0-AA31-6FE7475A60";   var intv setInterval(function (event) {        var value = document.getElementById("UUID").value;        var val_34 = value.substr(0, 34);//获取前34位        //var val_2 = value.subStr(value.length - 2, 2);//获取后两位        if (val_34 != tValue) {            document.getElementById("UUID").value = $("#hidUUID").val();        }    }, 100);    //---------监测UUID   end--------     //window.clearInterval(intv) //移除
 
 

 

16、setTimeout

setTimeout("alert('5 seconds!')",5000)

 

15、判断数组中是否存在指定元素

//if (MemberIDList.indexOf(_model.FriendID) >= 0) {
// _model.Display = "display:none"; //}; if ($.inArray(_model.FriendID, MemberIDList)>=0) { _model.Display = "display:none"; };

14、checkeBox 限制单选

//$("#myCheckBox").bind('change',function(){});  

//$("#myCheckBox").change(function(){})

//限制单选    $("input[name='kt']:checkbox").live("click", function () {        //$("input[name='kt']").each(function () {
// $(this).attr('checked', false); //}); //$(this).attr('checked', true); if ($(this).is(':checked')) { //alert($(this).attr('checked')) $(this).attr('checked', true).parent().parent().siblings().children().children().attr('checked', false); } else { $(this).attr('checked', false).parent().parent().siblings().children().children().attr('checked', false); } })
View Code

 相关HTML

View Code

 

转载于:https://www.cnblogs.com/xiaoshi657/p/4834966.html

你可能感兴趣的文章
【MySQL性能优化】MySQL常见SQL错误用法
查看>>
Vue2全家桶之一:vue-cli(vue脚手架)超详细教程
查看>>
Struts 2 常用技术
查看>>
树形DP
查看>>
python flask解决上传下载的问题
查看>>
语法测试
查看>>
CES1
查看>>
java webcontroller访问时报415错误
查看>>
qcow2、raw、vmdk等镜像格式
查看>>
Jzoj5455【NOIP2017提高A组冲刺11.6】拆网线
查看>>
特定字符序列的判断(1028)
查看>>
华为面试
查看>>
平衡二叉树(AVL Tree)
查看>>
【BZOJ3295】[Cqoi2011]动态逆序对 cdq分治
查看>>
【CF799E】Aquarium decoration 线段树
查看>>
大运飞天 鲲鹏展翅
查看>>
从ECMA到W3C
查看>>
软件工程--第十六周学习进度
查看>>
yii2 ActiveRecord多表关联以及多表关联搜索的实现
查看>>
搜狗输入法安装--ubuntu
查看>>