开发总结(2)---JavaScript
本文是我在平时工作中所遇到的javascript方面的一些知识总结,主要针对在asp.net中使用脚本
1.TextBox的验证(这个其实算是正则的内容了)
<!--用正则表达式限制只能输入中文--> <input type="text" onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))" /> <!--用正则表达式限制只能输入数字--> <input type="text" onkeyup="value=value.replace([^\d]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" /> <!--用正则表达式限制只能输入数字和英文--> <input type="text" onkeyup="value=value.replace([\W]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" /> <!--驗證數字和小數點--> <input type="text" ID="Text1" onkeyup="value=value.replace(/[^\d|^\.]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d|^\.]/g,''))"> <script type="text/javascript"> //去空格 function trim(str) { return str.replace(/(^\s*)|(\s*$)/g,""); } // 其中onbeforepaste属性是防止复制粘贴 //validate email function IsMail(mail) { var patrn = /^w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$/; return patrn.test(mail); } //validate url function IsURL(url) { var regexp = /^http://[A-Za-z0-9]+.[A-Za-z0-9]+[/=?%-&_~`@[]':+!]*([^<>""])*$/; return regexp.test(url); } </script>
2. 判断CheckBoxList有没有选择
//id为CheckBoxList控件的ID //return true 说明没有选择 function checkLocCate(id) { var status = true; var inputs = document.getElementById(id).getElementsByTagName("input"); for (var i = 0; i < inputs.length; i++) { if (inputs[i].type == "checkbox" && inputs[i].checked == true) { status = false; } } return status; }
3.为DropDownList添加项
//id为DropDownList控件的ID function addOptions(id) { var ddl = document.getElementById(id); //将DropDownList的内容清空 ddl.options.length = 0; for (var i = 0; i < 10; i++) { //Options的第一个参数为Text值,第二个参数为Value值 ddl.add(new Option(i, i)); } }
4.为table添加行和列
在javascript中添加行和列是通过insertRow和inertCell来实现的,看下面一个例子
<html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>AddRow</title> <style type="text/css"> .BlackBorder { background-color: #000; font-size: 12px; } .BlackBorder tr { background-color: #fff; } </style> </head> <body> <form id="form2" runat="server"> <div> <table width="400px"> <tr> <td> 姓名: <input id="txtName" style="width: 100px;" /> 年龄: <input id="txtAge" style="width: 50px;" /> <input id="txtAdd" type="button" value="新增" onclick="return insertRow()" /> </td> </tr> <tr> <td> <table id="tMemInfo" width="100%" class="BlackBorder" cellpadding="0" cellspacing="1" border="0" style="padding-left: 5px;"> <tr style="background-color: #E0E0E0;"> <td style="width: 150px;"> 姓名 </td> <td style="width: 100px;"> 年龄 </td> <td> 管理 </td> </tr> </table> </td> </tr> </table> </div> </form> <script type="text/javascript"> function insertRow() { var name = document.getElementById("txtName").value; var age = document.getElementById("txtAge").value; if (name == "") { alert("請填寫姓名"); document.getElementById("txtName").focus(); return false; } if (age == "") { alert("請填寫年龄"); document.getElementById("txtAge").focus(); return false; } var myTable = document.getElementById("tMemInfo"); var objRow = myTable.insertRow(1); var objCell = objRow.insertCell(0); objCell.innerHTML = "<input type='text' style='width:100px;' style='display:none'/><span >" + name + "</span>"; var objCell = objRow.insertCell(1); objCell.innerHTML = "<input type='text' style='width:50px;' style='display:none'/><span >" + age + "</span>"; var objCell = objRow.insertCell(2); objCell.innerHTML = " <input type='button' value='取消' onclick='cancel()' style='display:none'/> " + " <input type='button' value='儲存' onclick='save()' style='display:none'/>" + " <input type='button' value='修改' onclick='edit()' />" + " <input type='button' value='删除' onclick='deleteRow()' />"; document.getElementById("txtName").value = ""; document.getElementById("txtAge").value = ""; document.getElementById("txtName").focus(); } //删除行 function deleteRow() { var myTable = document.getElementById("tMemInfo"); var trList = myTable.getElementsByTagName("tr"); var row = 0; for (var i = 0; i < trList.length; i++) { if (event.srcElement.parentNode.parentNode == trList[i]) row = i; } myTable.deleteRow(row); } function cancel() { var e = event.srcElement.parentElement.parentElement; e.childNodes[0].childNodes[0].style.display = "none"; e.childNodes[0].childNodes[1].style.display = ""; e.childNodes[1].childNodes[0].style.display = "none"; e.childNodes[1].childNodes[1].style.display = ""; e.childNodes[2].childNodes[0].style.display = "none"; e.childNodes[2].childNodes[2].style.display = "none"; e.childNodes[2].childNodes[4].style.display = ""; e.childNodes[2].childNodes[6].style.display = ""; } function save() { var e = event.srcElement.parentElement.parentElement; e.childNodes[0].childNodes[0].style.display = "none"; e.childNodes[0].childNodes[1].style.display = ""; e.childNodes[1].childNodes[0].style.display = "none"; e.childNodes[1].childNodes[1].style.display = ""; e.childNodes[2].childNodes[0].style.display = "none"; e.childNodes[2].childNodes[2].style.display = "none"; e.childNodes[2].childNodes[4].style.display = ""; e.childNodes[2].childNodes[6].style.display = ""; e.childNodes[0].childNodes[1].innerHTML = e.childNodes[0].childNodes[0].value; e.childNodes[1].childNodes[1].innerHTML = e.childNodes[1].childNodes[0].value; } function edit() { var e = event.srcElement.parentElement.parentElement; e.childNodes[0].childNodes[0].style.display = ""; e.childNodes[0].childNodes[1].style.display = "none"; e.childNodes[1].childNodes[0].style.display = ""; e.childNodes[1].childNodes[1].style.display = "none"; e.childNodes[2].childNodes[0].style.display = ""; e.childNodes[2].childNodes[2].style.display = ""; e.childNodes[2].childNodes[4].style.display = "none"; e.childNodes[2].childNodes[6].style.display = "none"; e.childNodes[0].childNodes[0].value = e.childNodes[0].childNodes[1].innerHTML; e.childNodes[1].childNodes[0].value = e.childNodes[1].childNodes[1].innerHTML; } </script> </body> </html>
5 在javascript中setTimeOut和setInterval的區別
//1秒钟执行一次函数1 window.setInterval("函數1", 1000); //延迟1秒钟执行函数2 window.setTiemout("函數2", 1000);
6 js获取字符串的长度
var str = str.replace(/[^\x00-\xff]/g, "**").length;
不断更新中......
![](https://images.cnblogs.com/cnblogs_com/oec2003/219566/o_qrcode_for_gh_1a8c0bee3c6c_344.jpg)
微信公众号:不止dotNET
作者: oec2003
出处: http://oec2003.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则 保留追究法律责任的权利。
作者: oec2003
出处: http://oec2003.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则 保留追究法律责任的权利。