本文是我在平時工作中所遇到的javascript方面的一些知識總結,主要針對在asp.net中使用指令碼
1.TextBox的驗證(這個其實算是正則的內容了)
<!--用Regex限制只能輸入中文--><input type="text" onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))" /><!--用Regex限制只能輸入數字--><input type="text" onkeyup="value=value.replace([^\d]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" /><!--用Regex限制只能輸入數字和英文--><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 emailfunction IsMail(mail) { var patrn = /^w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$/; return patrn.test(mail);}//validate urlfunction 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控制項的IDfunction 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秒鐘執行一次函數1window.setInterval("函數1", 1000);//延遲1秒鐘執行函數2window.setTiemout("函數2", 1000);
6 js擷取字串的長度
var str = str.replace(/[^\x00-\xff]/g, "**").length;
不斷更新中......