JavaScript、Jquery常用属性

简介:

遍历

1、each()函数

http://www.cnblogs.com/xiaojinhe2/archive/2011/10/12/2208740.html


字符串:

1、字符串数组:

    a.将含特定分隔号的字符串截取成数组和取值。

    var keywords="我,是,字,符,串";

    var key = keywords.split(","); //以逗号将其分隔为长度为5的字符串数组

    for(i=0;i<key.length;i++){

        alert(key[i]);

    }

2、字符截取替换:

    a、截取:var value=province.substring(province.lastIndexOf(";")+1,province.length)

    b、替换:用str.replace("|",",") 只会替换第一个匹配的字符, str.replace(/\|/g,",")则可以替换掉全部匹配的字符(g为全局标志)。

变量  

1、js中定义字符灵活拼接的变量:

    var name = "test_"+num;   //拼接变更名,num是变量

    window[name] = 100;

    //使用的时候再拼接

    alert(window["test_"+num]); //100,需要调用再拼接取值


转义 

 $("#xid").append("<li><a href='javascript:void(0);' onclick='selectType(this,"+result[i].id+",\"abc\")' value='" + result[i].id + "'>" + result[i].name + "</a></li>");

注:此处需要将“abc”指定为字符串,所以双引号需要作为参数值的一部分传递,因此需要转义。


事件

 1、获取焦点时,如果输入框的内容为“手机”,则置为空。

    <input onfocus="if(this.value=='手机'){this.value=''}" />

 2、onerror

    JS通过onerror判断图片是否存在,如果不存在,则替换为指定的默认图片:


wKiom1iZg3HRnITjAAAHPCVTky0021.png-wh_50


    如果图片/img/10000011.jpg不存在,则显示/img/default.jpg。


操作


1、延时执行:

setTimeout(function() {

    alert(1);//这里写想要执行的代码,迟延1秒;

},1000);


2、提交请求:

    一、超链接:location.href="/company/DP_Ajax.action?presentProduct.id="+id;(id是变量)

  二、表单提交:

      (1)var form = document.getElementById('query');// 'query'是from表单id

          $('form[id=shopForm]').attr('action','/check.action'); //可更换

            form.submit();//提交

       (2)formName.submit();//"formName"为form表单的name属性值;

            

3、验证格式:

    var regular =/^[0-9]{1,5}$/;

    if(num!=null && regular.test(num)){}


4、替换页面内容/赋值:

    $("#operate_"+id).html("<span style='color:#999999;'>提取成功</span>"); //id变量

    $("#nameTip").css("color","#FF9966").html("请使用中英文、数字")

    $("input[name='province']").val("根据name属性赋值内容");

    $("#province").attr("val","abc");//替换自定义属性val的值,或者其它属性也行;


5、获取一个元素下子元素的数量:var num= $("#product_list ul").length;


6、下拉框操作:

    1、改变选项:        

1
2
   var grade= "test"
   $( "#grade option[value='" + grade+ "']" ).attr( "selected" , true );


7、全选:

    例一://全选----调用:onclick="checkAll(this);"

function checkAll(obj){

if(obj.checked){ 

       $("input[name='checkId']").attr('checked', true)

   }else{ 

       $("input[name='checkId']").attr('checked', false)

   } 

}


  例二:$("#checkall").click( 

  function(){ 

    if(this.checked){ 

        $("input[name='checkname']").attr('checked', true)

    }else{ 

        $("input[name='checkname']").attr('checked', false)

    } 

  } 

);

8、根据自定义属性赋值:

$("input[xid=key]").val("马尔代夫");

9、禁止浏览器后退:

$(document).ready(function(e) {

//以下代码都是有用的。

if (window.history && window.history.pushState) {

$(window).on('popstate', function () {

window.history.pushState('forward', null, '#');

window.history.forward(1);

});

}

window.history.pushState('forward', null, '#'); 

window.history.forward(1);

});

10、实时获取输入的内容:

$("input:text").bind("input propertychange",function(){
  alert($(this).val());//打印输入框字符长度
});

或:

<input type="text" oninput="onInput(event)" onpropertychange="onPropertyChange(event)">


11、input的禁用和只读不能css控制,所以用js、jquery处理

  $(".search-input").attr({"disabled":"disabled"});//禁用搜索框

  $(".search-input").attr({"readonly":"readonly"});//搜索框只读











本文转自 艺晨光 51CTO博客,原文链接:http://blog.51cto.com/ycgit/1617293,如需转载请自行联系原作者
目录
相关文章
|
1月前
|
开发框架 前端开发 JavaScript
使用JavaScript、jQuery和Bootstrap构建待办事项应用
使用JavaScript、jQuery和Bootstrap构建待办事项应用
13 0
N..
|
29天前
|
缓存 JavaScript 前端开发
Vue.js的计算属性
Vue.js的计算属性
N..
11 2
N..
|
29天前
|
JavaScript 前端开发 数据处理
Vue.js的过滤器和监听属性
Vue.js的过滤器和监听属性
N..
16 1
|
1月前
|
移动开发 JavaScript 前端开发
编程笔记 html5&css&js 028 HTML输入属性(2/2)
编程笔记 html5&css&js 028 HTML输入属性(2/2)
|
1月前
|
JavaScript 前端开发
编程笔记 html5&css&js 027 HTML输入属性(1/2)
编程笔记 html5&css&js 027 HTML输入属性(1/2)
|
1月前
编程笔记 html5&css&js 023 HTML表单属性
编程笔记 html5&css&js 023 HTML表单属性
|
1月前
|
存储 移动开发 前端开发
编程笔记 html5&css&js 010 HTML全局属性
编程笔记 html5&css&js 010 HTML全局属性
|
2月前
|
JavaScript 前端开发
JavaScript常用的属性
JavaScript常用的属性
|
3月前
|
前端开发 JavaScript 算法
深入探究 JavaScript 中的 String:常用方法和属性全解析(下)
深入探究 JavaScript 中的 String:常用方法和属性全解析(下)
|
3月前
|
前端开发 JavaScript 索引
深入探究 JavaScript 中的 String:常用方法和属性全解析(中)
深入探究 JavaScript 中的 String:常用方法和属性全解析(中)