页面常用到的js--待添加

/*这里将平时用到常见的js放进来,便于以后的查找和使用
*
*作者:刘建超
*创建时间:2017年7月19日11:38:00
*说明:每一个js方法对应使用用途,封装含义及使用事例;页面需要引用jQuery.js,单独需要引用jQuery.form.js的可做简单备注
*谨记:仅仅是进步一点点,也是进步.白纸黑字,才能看出来你的进步!!!
*/






/* 获取相同class下的input值*/  
//classname:同一个class
//querytable:要查询的标签
//values:标签内部某个属性
//返回结果是字符串,取到的每个标签以";"隔开,拼接成字符串
/*例如:
*<div class="ab"><input type="text" value="123" /></div>
*<div class="ab"><input type="text" value="456" /></div>
*<script type="javascript/text">
*var ab=getValues("ab","input","value");
*console.log(ab);//输出结果是:123;456
*</script>
*/
function getValues(classname,querytable,values){
  var a=document.getElementsByClassName(classname);
  var b = "";
  for (i = 0; i < a.length; i++) {
    var d = a[i].querySelector(querytable).attributes.getNamedItem(values).value;
    if(i==(a.length-1)){//这一步判断:如果为当前的最后一个元素,后面不用加“;”,便于之后使用split分割
      b=b+d;
    }else{
      b=b+d+";";
    }
  };
  return b;
}




/* 对于/Date(14007689023)/的格式 格式化方法:待添加
*调用
*"/Date(1405056837780)/".ToString("yyyy年MM月dd日hh时mm分ss秒");
*结果为:2014年7月11日13时33分57秒
*/
//往往json传过来的时间都是"/Date(1405056837780)/"
//转换需要的方法
String.prototype.ToString = function (format) {
    var dateTime = new Date(parseInt(this.substring(6, this.length - 2)));
    format = format.replace("yyyy", dateTime.getFullYear());
    format = format.replace("yy", dateTime.getFullYear().toString().substr(2));
    format = format.replace("MM", dateTime.getMonth() + 1)
    format = format.replace("dd", dateTime.getDate());
    format = format.replace("hh", dateTime.getHours());
    format = format.replace("mm", dateTime.getMinutes());
    format = format.replace("ss", dateTime.getSeconds());
    format = format.replace("ms", dateTime.getMilliseconds())
    return format;
};


/* 在自定义的时间上加减天数,获取最新时间
*date:用户自定义时间
*days:加(1,2,3...)减(-1,-2,-3...)天数
*例如:
var NowDay = new Date();
var nowdays =NowDay.getFullYear()+""+ (NowDay.getMonth() + 1) + "" + NowDay.getDate();
var cv=addDate(nowdays,3);//在当前时间上加三天
console.log(cv);//返回三天后的结果
*/
function addDate(date, days) {
    var d = new Date(date);
    d.setDate(d.getDate() + days);
    var month = d.getMonth() + 1;
    var day = d.getDate();
    if (month < 10) {
        month = "0" + month;
    }
    if (day < 10) {
        day = "0" + day;
    }
    var val = d.getFullYear() + "" + month + "" + day;
    return val;
}








/*待添加js方法
* 获取某一列的所有数据(数字),对数字的大小判断,如果大于一个数为红色,否则为绿色
*如:查找<td class="g56">567</td>中所有同className的数据,并根据数字大小更改颜色
*这里重点在于:掌握对样式的基本使用,样式的赋值等操作
*如果不会,可自行F12,在控制台中摸索
*注意:innerHTML获取的是子节点下所有信息,innerText获取的是子节点下的文字信息(不包括静态html信息)
*/
function changeColorByClassName() {
    var cha = document.getElementsByClassName("g56");//获取所有同classname的数据集合(数组)
    var a = cha.length;//查看集合的长度
    for (i = 0; i < cha.length; i++) {
        var b = cha[i];
        var c = parseInt(b.innerHTML);//将当前得到的string类型的数据转换成int整形再做判断处理
        if (c > 100) {
            b.style.color = "red";
        }
        else {
            b.style.color = "green";
        }
    }
}






/*待添加js方法
* 获取当前位置:省市区 摘自网页:http://www.jb51.net/article/58654.htm
*/
function getPCD() {
    $.getScript('http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js', function (_result) {
        if (remote_ip_info.ret == '1') {
            var result = "";
            var sheng = remote_ip_info.province ;
            var shi = remote_ip_info.city ;
            var qu = remote_ip_info.district ;
            if (sheng != "") {
                result += sheng + "省";
            }
            if (shi != "") {
                result += shi + "市";
            }
            if (qu != "") {
                result += qu + "区";
            }
            alert(result);
        } else {
            alert('没有找到匹配的IP地址信息!');
        }
    });
}




/* 获取当前位置IP*/
function getIP() {
    var url = 'http://chaxun.1616.net/s.php?type=ip&output=json&callback=?&_=' + Math.random();
    $.getJSON(url, function (data) {
        var aa = data.IP;
        return aa;
    });
}






/*待添加js方法: 前台页面需要传递数值:第一种  网址后面带参数
*如:h ttp://asdt.com/index.html?id=12
*使用方法正则判断获取到值,GetQueryString("id")
*解释:name即?后面的传递值
*/
function GetQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]); return null;
}






/* 前台页面需要传递数值:第二种  Cookie存取值*/
/*name:要存的值名称
*value:name的值
*如:存值setCookie("info","123");  取值var aa=getCookie("info");得到的值为"123"
*具体内容可看注释
*/
//存值
function setCookie(name, value) {
    var Days = 30;//设置失效天数
    var exp = new Date();
    exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);//设置失效时间为毫秒数,这里为30天的毫秒数
    document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
}
//取值
function getCookie(name) {
    var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
    if (arr = document.cookie.match(reg))//利用正则取出name的值信息
        return unescape(arr[2]);
    else
        return null;
}




/* 前台页面需要传递数值:第三种  Session存取值*/
/*name:要存的值名称
*value:name的值
*如:存值setItem("info","123");  取值var aa=getItem("info");得到的值为"123"
*/
//存值
function setSession(name, values) {
    if (window.sessionStorage) {
        sessionStorage.setItem(name, values);
        return true;
    }
}
//取值
function getSession(name) {
    if (window.sessionStorage) {
        var aa = sessionStorage.getItem(name);
        return aa;
    }
}


/* 前台页面需要传递数值:第四种  localStorage存取值*/
/*前提条件:引用domWeb.js(current page requires domWeb.js),domWeb.js放在个人文件夹(附带js)里面;
*name:要存的值名称
*value:name的值
*如:存值localStorage.setItem("info","123");  取值var aa=localStorage.getItem("info");得到的值为"123"
*/
localStorage.setItem("info", "123");
var aa = localStorage.getItem("info");




/ /有存取,就有销毁,具体内容可查看博客内容:http://www.cnblogs.com/amosli/p/4236231.html 6种方法清除页面的session和cookie
//不然,使用过后设置cookie或session值为空也可以,如setCookie("info","");sessionStorage.setItem("info","");
//页面内部的传值:附加影藏域"<input type='text' hidden='hidden' id='hidValue'>"


/*
*返回页面:待添加
*/
history.back();//返回到上一个页面
window.location.href = "";//返回到具体的某一个页面(相对路径下的页面)






/*
*
* JS判断是不是Decimal类型(正则实现)
*
*如:var aa=$("#id").val();  isDecimal(aa);可以直接使用判断是否是decimal类型
*
********/
function isDecimal(item) {
    if (item != null && typeof (item) != "undefined") {
        var str = item;
        if (str != "") {
            var pattern = '^-?[1-9]\\d*$|^-?0\\.\\d*$|^-?[1-9]\\d*\\.\\d*$';
            var reg = new RegExp(pattern, 'g');
            if (reg.test(str)) {
                return true;
            } else {
                if (str.match(/[^0-9\.-]/g) != null) {
                    if (str.match(/[^0-9\.-]/g).length > 0) {
                        str = str.replace(/[^0-9\.-]/g, '');
                        $(item).val(str);
                    }
                }
            }
        }
    }
    return false;
}




/*
*
* 正则:判断字符串中是否包含一段字符串
*
*
*********/
var str = "My blog name is Benjamin-专注前端开发和用户体验",
    substr = "Benjamin";


function isContains(str, substr) {
    return new RegExp(substr).test(str);
}
console.log(isContains(str, substr));//输出结果:true






/*
*
* 正则:验证身份证信息
*
*
*********/


function isCardID(sId) {
    var aCity = {
        11: "北京", 12: "天津", 13: "河北", 14: "山西", 15: "内蒙古",
        21: "辽宁", 22: "吉林", 23: "黑龙江", 31: "上海", 32: "江苏",
        33: "浙江", 34: "安徽", 35: "福建", 36: "江西", 37: "山东", 41: "河南",
        42: "湖北", 43: "湖南", 44: "广东", 45: "广西", 46: "海南", 50: "重庆",
        51: "四川", 52: "贵州", 53: "云南", 54: "西藏", 61: "陕西", 62: "甘肃",
        63: "青海", 64: "宁夏", 65: "新疆", 71: "台湾", 81: "香港", 82: "澳门", 91: "国外"
    };
    var iSum = 0;
    var info = "";
    if (!/^\d{17}(\d|x)$/i.test(sId)) return "你输入的身份证长度或格式错误";
    sId = sId.replace(/x$/i, "a");
    if (aCity[parseInt(sId.substr(0, 2))] == null) return "你的身份证地区非法";
    sBirthday = sId.substr(6, 4) + "-" + Number(sId.substr(10, 2)) + "-" + Number(sId.substr(12, 2));
    var d = new Date(sBirthday.replace(/-/g, "/"));
    if (sBirthday != (d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate())) return "身份证上的出生日期非法";
    for (var i = 17; i >= 0; i--) iSum += (Math.pow(2, i) % 11) * parseInt(sId.charAt(17 - i), 11);
    if (iSum % 11 != 1) return "你输入的身份证号非法";
    //aCity[parseInt(sId.substr(0,2))]+","+sBirthday+","+(sId.substr(16,1)%2?"男":"女");//此次还可以判断出输入的身份证号的人性别
    return true;
};








/*待添加js方法
*第三方弹出框插件layer
*/
setTimeout(function () {
    var index = parent.layer.getFrameIndex(window.name);
    parent.layer.close(index);
}, 1000);
window.parent.Search();//关闭当前编辑页面并执行首页的查询方法






/*
* 计算天数差的函数,通用
*/
function DateDiff(sDate1, sDate2) {    //sDate1和sDate2是2006-12-18格式
    var aDate, oDate1, oDate2, iDays
    aDate = sDate1.split("-")
    oDate1 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0])    //转换为12-18-2006格式
    aDate = sDate2.split("-")
    oDate2 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0])
    iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 / 24)    //把相差的毫秒数转换为天数
    return iDays
}






/* 
* 方法:Array.baoremove(dx) 
* 功能: 删除数组元素. 
* 参数:dx删除元素的下标. 
* 返回:在原数组上修改数组. 
*/
Array.prototype.baoremove = function (dx) {
    if (isNaN(dx) || dx > this.length) { return false; }
    this.splice(dx, 1);
}
b = ['1', '2', '3', '4', '5'];
alert("elements: " + b + "\nLength: " + b.length);
b.baoremove(1); //删除下标为1的元素 
alert("elements: " + b + "\nLength: " + b.length);






function removeByValue(arr, val) {
    for (var i = 0; i < arr.length; i++) {
        if (arr[i] == val) {
            arr.splice(i, 1);
            break;
        }
    }
}
var somearray = ["mon", "tue", "wed", "thur"]
removeByValue(somearray, "tue");
//somearray will now have "mon", "wed", "thur"


/*页面点击enter跳转事件

*例:页面上有个文本框<input type="text" οnkeydοwn="Login(event)" />

*/

function Login(e){

  var result=window.event||e;

  if(result.keyCode==13){//13是键盘上面固定的回车键

    alert("123");//这里放入你想要运行的方法

  }

}


/*待添加js方法
*
*/
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
很抱歉,作为一个文本生成模型,我不能生成完整的代码项目。但是,我可以为您提供一些示例代码,您可以在此基础上进行修改和扩展。 以下是用HTML、CSS和JavaScript生成登录验证页面的示例代码: ``` <!DOCTYPE html> <html> <head> <style> /* 这里是CSS样式 */ .form-container { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; } form { background-color: #fff; padding: 2rem; border-radius: 1rem; box-shadow: 0 0 10px #ccc; display: flex; flex-direction: column; align-items: center; } input[type="text"], input[type="password"] { margin-top: 1rem; padding: 0.5rem; border-radius: 0.25rem; border: 1px solid #ccc; font-size: 1rem; width: 20rem; } input[type="submit"] { margin-top: 1rem; padding: 0.75rem 1.5rem; background-color: blue; color: #fff; border-radius: 0.25rem; border: none; font-size: 1rem; cursor: pointer; } </style> </head> <body> <div class="form-container"> <form> <h3>登录页面</h3> <input type="text" placeholder="用户名" /> <input type="password" placeholder="密码" /> <input type="submit" value="提交" /> </form> </div> <script> // 这里是JavaScript代码 const form = document.querySelector("form"); form.addEventListener("submit", function(event) { event.preventDefault(); const username = form.querySelector('input[type="text"]').value; const password = form.querySelector('input[type="password"]').value; if (!username || !password) { alert("请输入用户名和密码"); return; } // 这里可以进行用户

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值