js常用方法

var a = b && 1;
//相当于
if (b) {
  a = 1
}

var a = b || 1; //适合用法方法参数的默认值
//相当于
if (b) {
  a = b;
} else {
  a = 1;
}

 

jQuery 常用方法

1.  模糊匹配：

    查找“div_1”,“div_2”,“div_3”,“div_4”......
    $("div[id^=div_']")，
 
2.  字符串截取
    var abc = "1234_456";
    abc.substring(abc.indexOf("_"));     _456
    abc.substring(0,abc.lastIndexOf("_"));     1234
 
3.  匹配对应元素
$("#BigImage a:eq("+$("#Scroll li").index(this)+")").show().siblings("#BigImage a").hide();
 
4. js判断对象是否存在
if (typeof(your_var) == "undefined") || your_var == null) {
     alert("your_var is undefined");
}
 
5. scrollTop滑动
    方法一： window.scrollTo(0,0);
    方法二：$('html,body').delay(2000).animate({scrollTop: $('#aaa').offset().top}, 1000);
 
6. 修正ie6最大宽度和最大高度的bug
 
    //修正IE6最大宽度和最大宽度高度的Bug start
function ie6Max(n){
    var maxWidth = parseInt($(this).css('max-width'));
    var maxHeight = parseInt($(this).css('max-height'));
  
    if($(this).height() > maxHeight || $(this).width() > maxWidth){
        var wh = $(this).width() / $(this).height();
        if( $(this).height() > $(this).width()){
            $(this).height(maxHeight);
            $(this).width($(this).height() * wh);
        }else{
            $(this).width(maxWidth);
            $(this).height($(this).width() / wh);
        };
    }
}
//修正IE6最大宽度和最大宽度高度的Bug end
 
7. 点击网页空白处隐藏某个div
 $(document).click(function(e){
  if(!$(e.target).closest("#Extend").is("div") && !$(e.target).closest(".region").is("div")){
   $("#Extend").hide();
  }
 });
 
8. 获取scrollTop
    纯js
    var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
  
    jQuery
    var scrollTop1 = $(this).scrollTop()
 
9.  判断IE6

 纯js的方法：

var isIE6 = !-[1,] && !window.XMLHttpRequest;

 

html注释方法

<!--[if IE 6]> some codes...  <![endif]-->

 

 jQuery方法

if ($.browser.msie && (parseInt($.browser.version) <= 7)){

     some codes...

}

 

10. 悬浮框效果

<script type="text/javascript">
//悬浮框效果

$(function(){
  
    $(window).bind('scroll resize', function(){
        var scrollTop = $(this).scrollTop();
        var aaa = scrollTop - $("#proListTop").offset().top + 20;

        if ($("#proListTop").offset().top < ScrollTop - 60) {
            $("#compareBar").css("top",aaa);
        }else{
            $("#compareBar").css("top","60px");
        }
 });
 
});

</script>

 

11.  转移和复制div的内容

$('#bbb').append($('#aaa').clone());   把aaa中的内容复制到bbb中去

$('#aaa').appendTo($('#bbb'));    把aaa中的内容剪切到bbb中去

 

12. 关闭输入框自动提示

autocomplete="off"

 

13. 图片最大宽度和最大高度限制

var maxWidth = parseInt($(this).css('max-width'));
                var maxHeight = parseInt($(this).css('max-height'));
                if($(this).height() > maxHeight || $(this).width() > maxWidth){
                    if( $(this).height()%$(this).width() > 0.752){
                        $(this).height(maxHeight);
                    }else{
                        $(this).width(maxWidth);
                    };
              
                }

 

14.  图片加载的loading

$(function(){
 $.fn.LoadingImg = function(){
  return this.each(function(){
   var that = this;
   var src=$(this).attr("src2");
   var img=new Image();
   img.src=src;
   var loading=$("<img alt=\"加载中...\" class=\"loadingImg\" title=\"图片加载中...\" src=\"loading.gif\" />");
   $(this).after(loading);
   $(this).hide();
   $(img).load(function(){
    loading.remove();
    $(that).attr("src",src);
    $(that).show();
   });
 
  });
 };
 $("img").LoadingImg();
});

 

15. iPad，iPhone浏览器判别

if(navigator.userAgent.toLowerCase().match(/iPad/i) == "ipad"){

    这是苹果iPad、iPhone浏览器

}

 

16 条件加载Jquery
<!– Grab Google CDN jQuery. fall back to local if necessary –>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js”></script>
<script>!window.jQuery && document.write(’<script src=”js/jquery-1.4.2.min.js”><\/script>’)</script>
如果CDN没有下载到Jquery，则从本地读取

17. 判断元素是否存在
$("#aaa").length == 0

18. string转json
var data = eval('({"aa":"123"})');

var dd = '{"a":"123"}';
var data = eval('('+dd+')');

/**
* 对JSON对象转换为字符串.
* @param {json对象} json
* @return {json字符串}
*/
function jsonObj2Str(json) {
        var str = "{";
        for (prop in json) {
                str += prop + ":" + json[prop] + ",";
        }
        str = str.substr(0, str.length - 1);
        str += "}";
        return str;
}

/**
* 将json字符串转换为json对象.
* @param {json字符串} jsonstr
* @return {json对象}
*/
function jsonStr2Obj(jsonstr) {
         return eval("("+jsonstr+")");
}

/**
* 得到一个元素的left坐标值.
* @param {dom对象} obj
* @return {位置值}
*/
function getLeft(obj){
        var offset=e.offsetLeft;
        if(e.offsetParent!=null) offset+=getLeft(e.offsetParent);
        return offset;
}

/**
* 得到一个元素的绝对位置的top坐标值.
* @param {dom对象} obj
* @return {位置值}
*/
function getTop(obj){
        var offset=e.offsetTop;
        if(e.offsetParent!=null) offset+=getTop(e.offsetParent);
        return offset;
}

/**
* 删除一个字符串的左右空格.
* @param {原始字符串} str
* @return {删除空格之后的字符串}
*/
function  trim(str)
{ 
   return  str.replace(/(^\s*)|(\s*$)/g,""); 
}

/***************以下方法和表单验证相关*************************************************/
/**
* 返回非空字符串,如果有默认值就返回默认字符串.
* @param {要进行转换的原字符串} str
* @param {默认值} defaultStr
* @return {返回结果}
*/
function notNull(str, defaultStr) {
        if (typeof(str) == "undefined" || str == null || str == '') {
                if (defaultStr)
                        return defaultStr;
                else
                        return '';
        } else {
                return str;
        }
} 

/**
* 比较两个日期大小.
* @param {较小日期的文本框id} smallDate
* @param {较大日期的文本框id} bigDate
* @param {出错的提示信息} msg
*/
function compareTwoDate(smallDate, bigDate, msg) {
        var v1 = $(smallDate).value;
        var v2 = $(bigDate).value;
        if (v1 >= v2) {
                alert(msg);
                                v2.focus();
                return false;
        }
        return true;
}

/**
* 比较两个金额大小的方法.
* @param {较小的金额} smallNum
* @param {较大的金额} bigNum
* @param {出错提示信息} msg
* @return {Boolean}
*/
function compareTwoNum(smallNum, bigNum, msg) {
        var v1 = $(smallNum).value;
        var v2 = $(bigNum).value;
        if (parseFloat(v1) >= parseFloat(v2)) {
                alert(msg);
                                v2.focus();
                return false;
        }
        return true;
}

/**
* 检查文本框的长度是否超出指定长度.
* @param {文本id} textId
* @param {文本框的最大长度} len
* @param {文本框描述内容} msg
* @return {有错就返回false,否则返回true}
*/
function checkLength(textId, len, msg) {
        obj = $(textId);
        str = obj.value;
        str = str.replace(/[^\x00-\xff]/g, "**");
        realLen = str.length;
        if (realLen > len) {
                alert("[" + msg + "]" + "长度最大为" + len + "位," + "请重新输入！\n注意：一个汉字占2位。");
                obj.focus();
                return false;
        } else
                return true;
}

/**
* 判断某个文本框不可以为空.
* @param {文本框id} textId
* @param {文本框描述内容} msg
* @return {有错就返回false,否则返回true}
*/
function checkIfEmpty(textId, msg) {
        var textObj = $(textId);
        var textValue = textObj.value;
        if (trim(textValue) == '') {
                alert('[' + msg + ']不得为空！');
                textObj.focus();
                return false;
        } else {
                return true;
        }
}

/**
* 判断指定文本框内容必须为邮件.
* @param {文本框id} textId
* @param {文本框描述} msg
* @return {如果是邮件内容就返回true否则返回false}
*/
function checkIsMail(textId, msg) {
        var obj = $(textId);
        if (!_isEmail(obj.value)) {
                alert('[' + msg + ']不是合法的邮件地址！');
                obj.focus();
                return false;
        } else
                return true;
}

/**
* 验证是不是邮件.
* @param {要验证的字符串} strEmail
* @return {Boolean}
*/
function _isEmail(strEmail) {
        //接下来的验证是否有两个以上的‘.’号，有的话就是错的！
        var first = strEmail.indexOf('.'); 
        if (strEmail.indexOf('@')== -1) {
                return false;
        }
        var tempStr = strEmail.substring(first + 1);
         if (tempStr.indexOf('.') != -1) {
                return false;
        }
        if (strEmail
                        .search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1) {
                return true;
        } else
                return false;
}

/**
* 判断某个文本框是否数字.
* @param {文本框id} textId
* @param {文本框描述内容} msg
* @return {Boolean}
*/
function checkIsNum(textId, msg) {
        obj = $(textId);
        if (isNaN(obj.value)) {
                alert('[' + msg + ']必须为数字。');
                obj.focus();
                return false;
        } else
                return true;
}

/**
* 判断某个文本框是否含有非法字符.
* @param {文本框的id} textId
* @param {文本框描述内容} msg
* @return {有错就返回false否则返回true}
*/
function checkIsValid(textId, msg) {
        obj = $(textId);
        if (!_isValidString(obj.value, '[' + msg + ']不得含有非法字符。')) {
                obj.focus();
                return false;
        }
        return true;
}

/**
* 判断是不是合法字符串.
* @param {要进行判断的字符串} szStr
* @param {文本描述} errMsg
* @return {合法则返回true否则返回false}
*/
function _isValidString(szStr,errMsg) {
        voidChar = "'\"><`~!@#$%^&\(\)（）！￥……？?“”‘’*";
        for (var i = 0; i < voidChar.length; i++) {
                aChar = voidChar.substring(i, i + 1);
                if (szStr.indexOf(aChar) > -1){
                        alert(errMsg)
                        return false;
                }
        }
        return true;
}

/*************** 以下方法和下拉菜单相关*************************************************/
/**
* 控制下拉菜单不可以为-1(未选择情况value=-1)
* @param {下拉菜单id} selectId
* @param {下拉菜单描述内容} msg
* @param {下拉菜单的空值对应的value,默认为-1} nullValue
* @return {Boolean}
*/
function checkChooseSelect(selectId, msg ,nullValue) {
        var obj = $(selectId);
        if (obj.value == notNull(nullValue,'-1')) {
                alert('[' + msg + ']必选!');
                obj.focus();
                return false;
        } else
                return true;
}

/**
* 得到下拉菜单的显示的文字.
* @param {下拉菜单dom对象} selectObj
* @return {返回下拉菜单的显示的"文本"}
*/
function getSelectText(selectObj) {
       return selectObj.options[selectObj.selectedIndex].text;
}

/**
* 得到下拉菜单的显示的值.
* @param {下拉菜单dom对象} selectObj
* @return {得到下拉菜单的显示的"值"}
*/
function getSelectValue(selectObj) {
        return selectObj.options[selectObj.selectedIndex].value;
}

/**
* 设置下拉菜单的选择状态到指定的值.
* @param {下拉菜单对象} obj
* @param {要选择的值} value
*/
function setSelectValue(obj, value) {
        /*for (i = obj.options.length - 1; i >= 0; i--) {
                if (obj.options[i].value == value) {
                        obj.options[i].selected = true;
                        return;
                }
        }
*/
      obj.value= value;
}

/**
* 根据键值串的内容进行下拉菜单的动态组装
* @param {要进行下拉菜单组装的dom对象} obj
* @param {键值对用,和;分割,例如'1,男;2,女;3,未知'} valAndText
*/
function setSelectContent(obj,valAndText){
        if(trim(valAndText)==''){
                alert('没有要进行组装下拉菜单的数据!');
                return false;               
        }
        clearSelect(obj);
        var keyandvalues = valAndText.split(';');
        for(var i=0;i<keyandvalues.length;i++){
                var arr = keyandvalues[i].split(',');
                if(arr){
                        var value =arr[0];
                        var text =arr[1];
                        var objOption = new Option(text,value);
                        obj.add(objOption);
                }
        }
}

/**
* 清空下拉菜单里面的内容.
* @param {下拉菜单对象} obj
*/
function clearSelect(obj) {
    for (var i=obj.options.length; i >0; i--) {
        obj.remove(0);
    }       
}

/*************** 以下方法和多选框相关*************************************************/
/**
* 返回选中的checks的id组成的字符串,逗号隔开.
* @param {checks数组} checks
* @return 选择的id组成的字符串
*/
function getCheckedIds(checks){
        var selectedValue = '';
        var len = checks.length;
        for(var index=0; index<len; index++) {
        if(checks[index].checked==true) {
            selectedValue +=  checks[index].value+",";
        }
    }
        if(selectedValue.length>0)
                return selectedValue.substring(0,selectedValue.length-1);
    return selectedValue;
}