jQuery技术

JavaScript小技巧 tips

字号+ 作者:H5之家 来源:H5之家 2017-09-12 09:41 我要评论( )

欢迎点击链接:http://blog.csdn.net/weixin_37848710/article/details/77840434得收藏的JavaScripttips(21):1根据索引移除数组中的某个元素假如需要从Javascri

欢迎点击链接:

值得收藏的JavaScript tips(21):

1 根据索引移除数组中的某个元素
假如需要从Javascript数组中移除某个元素,可以使用splice方法,该方法将根据传入参数n,移除数组中移除第n个元素(Javascript数组中从第0位开始计算)。
function removeByIndex(arr, index) { 
    arr.splice(index, 1); 

test = new Array(); 
test[0] = 'Apple'; 
test[1] = 'Ball'; 
test[2] = 'Cat'; 
test[3] = 'Dog'; 
alert("Array before removing elements: "+test); 
removeByIndex(test, 2); 
alert("Array after removing elements: "+test); 
则最后输出的为Apple,Ball,Dog

2 根据元素的值移除数组元素中的值
下面这个技巧是很实用的,是根据给定的值去删除数组中的元素,代码如下:
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 将会有的元素是 "mon", "wed", "thur" 
当然,更好的方式是使用prototype的方法去实现,如下代码:
Array.prototype.removeByValue = function(val) { 
    for(var i=0; i<this.length; i++) { 
        if(this[i] == val) { 
            this.splice(i, 1); 
            break; 
        } 
    } 

//.. 
var somearray = ["mon", "tue", "wed", "thur"] 
somearray.removeByValue("tue"); 

3  通过字符串指定的方式动态调用某个方法
有的时候,需要在运行时,动态调用某个已经存在的方法,并为其传入参数。这个如何实现呢?下面的代码可以:
var strFun = "someFunction"; //someFunction 为已经定义的方法名 
var strParam = "this is the parameter"; //要传入方法的参数   
var fn = window[strFun]; 
//调用方法传入参数 
fn(strParam); 

4 产生1到N的随机数
var random = Math.floor(Math.random() * N + 1);
//产生1到10之间的随机数 
var random = Math.floor(Math.random() * 10 + 1);
//产生1到100之间的随机数 
var random = Math.floor(Math.random() * 100 + 1);

5 捕捉浏览器关闭的事件
我们经常希望在用户关闭浏览器的时候,提示用户要保存尚未保存的东西,则下面的这个Javascript技巧是十分有用的,代码如下:
<script language="javascript"> 
function fnUnloadHandler() { 
       alert("Unload event.. Do something to invalidate users session.."); 

</script> 
<body onbeforeunload="fnUnloadHandler()"> 
………     
</body>
就是编写 onbeforeunload() 事件的代码即可。

6 检查是否按了回退键
同样,可以检查用户是否按了回退键,代码如下:
window.onbeforeunload = function() {  
    return "You work will be lost.";  
};

7 检查表单数据是否改变
有的时候,需要检查用户是否修改了一个表单中的内容,则可以使用下面的技巧,其中如果修改了表单的内容则返回true,
没修改表单的内容则返回false。代码如下:
function formIsDirty(form) { 
  for (var i = 0; i < form.elements.length; i++) { 
    var element = form.elements[i]; 
    var type = element.type; 
    if (type == "checkbox" || type == "radio") { 
      if (element.checked != element.defaultChecked) { 
        return true; 
      } 
    } 
    else if (type == "hidden" || type == "password" || 
             type == "text" || type == "textarea") { 
      if (element.value != element.defaultValue) { 
        return true; 
      } 
    } 
    else if (type == "select-one" || type == "select-multiple") { 
      for (var j = 0; j < element.options.length; j++) { 
        if (element.options[j].selected != 
            element.options[j].defaultSelected) { 
          return true; 
        } 
      } 
    } 
  } 
  return false; 

window.onbeforeunload = function(e) { 
  e = e || window.event;   
  if (formIsDirty(document.forms["someForm"])) { 
    // IE 和 Firefox 
    if (e) { 
      e.returnValue = "You have unsaved changes."; 
    } 
    // Safari浏览器 
    return "You have unsaved changes."; 
  } 
};

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 15个强大的jQuery开发技巧和心得

    15个强大的jQuery开发技巧和心得

    2017-09-08 15:00

  • 将jQuery用得更高效的22条技巧

    将jQuery用得更高效的22条技巧

    2017-09-08 15:00

  • 9.1 技巧:搭建jQuery Mobile基础页面

    9.1 技巧:搭建jQuery Mobile基础页面

    2017-09-06 14:50

  • 黑马程序员php培训:javascript+jquery九天课程第九天(8)

    黑马程序员php培训:javascript+jquery九天课程第九天(8)

    2017-09-04 09:04

网友点评