jquery项目怎么跑起来_jquery项目中一些常用方法

1、获取url中的参数

function getUrlParam(name) {

var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); //构造一个含有目标参数的正则表达式对象

var r = window.location.search.substr(1).match(reg);  //匹配目标参数以及解析中文乱码问题

if (r != null) return decodeURI(r[2]); return null; //返回参数值

}

调用：getUrlParam(参数名称)    注意：参数名称是一个字符串

2、封装ajax加移动端当数据没出现出现加载图标

//封装ajax请求、

function ajax_datatypeByXml(type, url, Xml_data, func) {//data数据可以为空

$.ajax({

type: type,

url: url,

async: false,

dataType: "json",

timeout: 30000, //超时时间：30秒

data: Xml_data,

beforeSend: function () {

mui.showLoading("正在加载..", "div"); //加载文字和类型，plus环境中类型为div时强制以div方式显示

},

complete: function () {

mui.hideLoading(function () {

});//隐藏后的回调函数

},

success: function (data) {

if (data) {

func(data);

} else {

mui.alert("数据加载失败");

}

},

error: function() {

mui.alert('服务器连接超时，请稍后再试');

}

});

}

//扩展mui.showLoading

(function ($, window) {

//显示加载框

$.showLoading = function (message, type) {

if ($.os.plus && type !== 'div') {

$.plusReady(function () {

plus.nativeUI.showWaiting(message);

});

} else {

var html = '';

html += '';

html += '

' + (message || "数据加载中") + '

';

//遮罩层

var mask = document.getElementsByClassName("mui-show-loading-mask");

if (mask.length == 0) {

mask = document.createElement('div');

mask.classList.add("mui-show-loading-mask");

document.body.appendChild(mask);

mask.addEventListener("touchmove", function (e) { e.stopPropagation(); e.preventDefault(); });

} else {

mask[0].classList.remove("mui-show-loading-mask-hidden");

}

//加载框

var toast = document.getElementsByClassName("mui-show-loading");

if (toast.length == 0) {

toast = document.createElement('div');

toast.classList.add("mui-show-loading");

toast.classList.add('loading-visible');

document.body.appendChild(toast);

toast.innerHTML = html;

toast.addEventListener("touchmove", function (e) { e.stopPropagation(); e.preventDefault(); });

} else {

toast[0].innerHTML = html;

toast[0].classList.add("loading-visible");

}

}

};

//隐藏加载框

$.hideLoading = function (callback) {

if ($.os.plus) {

$.plusReady(function () {

plus.nativeUI.closeWaiting();

});

}

var mask = document.getElementsByClassName("mui-show-loading-mask");

var toast = document.getElementsByClassName("mui-show-loading");

if (mask.length > 0) {

mask[0].classList.add("mui-show-loading-mask-hidden");

}

if (toast.length > 0) {

toast[0].classList.remove("loading-visible");

callback && callback();

}

}

})(mui, window);

3、初始化移动端根节点字体大小用作rem值

window.addEventListener("resize", setSize, false);

window.addEventListener("orientationchange", setSize, false);

function setSize() {

var oHtml = document.getElementsByTagName("html")[0];

var iWidth = oHtml.getBoundingClientRect().width;

$("html").css("fontSize", iWidth / 15)

}

4、根据年月获得当月天数的实现代码

function getDaysInMonth(year, month) {

month = parseInt(month, 10);

var temp = new Date(year, month, 0);

return temp.getDate();

}

5、屏蔽打印console

console.log=function(){}

6、当动态生成li时点击事件有时可能会触发两次解决办法

$('body').off('click').on('click','selector',function(){});

使用之前要清理掉body上绑定的click事件，利用了jQuery里面off()方法

7、选择input框的选中状态操作

全选

function checkAll()

{

var checkedOfAll=$("#selectAll").prop("checked");

$("input[name='procheck']").prop("checked", checkedOfAll);

alert(checkedOfAll);

}

8、鼠标移入移出事件并在移入时操作

$(".contactus-wrap").mouseover( function () {

clearTimeout(time);

$(".contactus").css({

"opacity": 1,

"left":"12px"

})

});

$(".contactus-wrap").mouseout(

function () {

time = setTimeout(function () {

$(".contactus").css({

"opacity": 0,

"left": "-206px"

})

}, 500)

});

$(".contactus").mouseover(function () {

clearTimeout(time); $(".contactus").css({

"opacity": 1,

"left": "12px"

})

});

$(".contactus").mouseout(function () {

time = setTimeout(function () {

$(".contactus").css({

"opacity": 0,

"left": "-206px"

})

}, 500);

});

9、jquery中获取父级iframe中的dom元素

$(parent.window.document).find("iframe").contents().find("#F_HTNO")；

10、textarea自动换行，且文本框根据输入内容自适应高度

输入框自适应

//textare自动换行

/**

* 文本框根据输入内容自适应高度

* @param {HTMLElement} 输入框元素

* @param {Number} 设置光标与输入框保持的距离(默认0)

* @param {Number} 设置最大高度(可选)*/

varautoTextarea= function(elem, extra, maxHeight) {

extra=extra|| 0;varisFirefox= !!document.getBoxObjectFor|| 'mozInnerScreenX' inwindow,

isOpera= !!window.opera&& !!window.opera.toString().indexOf('Opera'),

addEvent= function(type, callback) {

elem.addEventListener?elem.addEventListener(type, callback,false) :

elem.attachEvent('on' +type, callback);

},

getStyle=elem.currentStyle? function(name) {varval=elem.currentStyle[name];if(name=== 'height' &&val.search(/px/i)!== 1) {varrect=elem.getBoundingClientRect();returnrect.bottom-rect.top-parseFloat(getStyle('paddingTop'))-parseFloat(getStyle('paddingBottom'))+ 'px';

};returnval;

} :function(name) {returngetComputedStyle(elem,null)[name];

},

minHeight=parseFloat(getStyle('height'));

elem.style.resize= 'none';varchange= function() {varscrollTop, height,

padding= 0,

style=elem.style;if(elem._length===elem.value.length)return;

elem._length=elem.value.length;if(!isFirefox&& !isOpera) {

padding=parseInt(getStyle('paddingTop'))+parseInt(getStyle('paddingBottom'));

};

scrollTop=document.body.scrollTop||document.documentElement.scrollTop;

elem.style.height=minHeight+ 'px';if(elem.scrollHeight>minHeight) {if(maxHeight&&elem.scrollHeight>maxHeight) {

height=maxHeight;

style.overflowY= 'auto';

}else{

height=elem.scrollHeight;

style.overflowY= 'hidden';

};

style.height=height+extra+ 'px';//scrollTop += parseInt(style.height) - elem.currHeight;

//document.body.scrollTop = scrollTop;

//document.documentElement.scrollTop = scrollTop;

elem.currHeight=parseInt(style.height);

};

};

addEvent('propertychange', change);

addEvent('input', change);

addEvent('focus', change);

change();

};

$(document).ready(function() {

$("table td").each(function() {if($(this).find("[datatype='required']").length> 0||$(this).find("[datatype='number']").length> 0) {

$(this).css("position","relative");

}

})

})

border-bottom-width: 1px;height: 39px; background: transparent; text-align:left"type="text">