51 動態改變表單的action
1: <form name=”myForm” action=”login.html”> 2: Username: <input type=”text” name=”username”><br/> 3: Password: <input type=”password” name=”password”><br/> 4: <input type=”button” value=”Login” onClick=”this.form.submit();”> 5: <input type=”button” value=”Register” onClick=”this.form.action = ‘register.html’; this.form.submit();”> 6: <input type=”button” value=”Retrieve Password” onClick=”this.form.action = ‘password.html’; this.form.submit();”> 7: </form>
52 使用圖像按鈕
1: <form name=”myForm” action=”login.html”> 2: Username: <input type=”text” name=”username”><br/> 3: Password: <input type=”password”name=”password”><br/> 4: <input type=”image” src="/”login.gif"” value=”Login”> 5: </form> 6:
53 表單數據的加密
1: <SCRIPT LANGUAGE='JavaScript'> 2: <!-- 3: function encrypt(item) { 4: var newItem = ''; 5: for (i=0; i < item.length; i++) { 6: newItem += item.charCodeAt(i) + '.'; 7: } 8: return newItem; 9: } 10: function encryptForm(myForm) { 11: for (i=0; i < myForm.elements.length; i++) { 12: myForm.elements[i].value = encrypt(myForm.elements[i].value); 13: } 14: } 15: 16: //--> 17: </SCRIPT> 18: <form name='myForm' onSubmit='encryptForm(this); window.alert(this.myField.value);'> 19: Enter Some Text: <input type=text name=myField><input type=submit> 20: </form>
JavaScript就這麼回事5:窗口和框架
54 改變瀏覽器狀態欄文字提示
1: <script language=”JavaScript”> 2: window.status = “A new status message”; 3: </script>
55 彈出確認提示框
1: <script language=”JavaScript”> 2: var userChoice = window.confirm(“Click OK or Cancel”); 3: if (userChoice) { 4: document.write(“You chose OK”); 5: } else { 6: document.write(“You chose Cancel”); 7: } 8: </script>
56 提示輸入
1: <script language=”JavaScript”> 2: var userName = window.prompt(“Please Enter Your Name”,”Enter Your Name Here”); 3: document.write(“Your Name is “ + userName); 4: </script>
57 打開一個新窗口
1: //打開一個名稱爲myNewWindow的瀏覽器新窗口 2: <script language=”JavaScript”> 3: window.open(“http://www.liu21st.com/”,”myNewWindow”); 4: </script>
58 設置新窗口的大小
1: <script language=”JavaScript”> 2: window.open(“http://www.liu21st.com/”,”myNewWindow”,'height=300,width=300'); 3: </script>
59 設置新窗口的位置
1: <script language=”JavaScript”> 2: window.open(“http://www.liu21st.com/”,”myNewWindow”,'height=300,width=300,left=200,screenX=200,top=100,screenY=100'); 3: </script>
60 是否顯示工具欄和滾動欄
1: <script language=”JavaScript”> 2: window.open(“http:
61 是否可以縮放新窗口的大小
1: <script language=”JavaScript”> 2: window.open('http://www.liu21st.com/' , 'myNewWindow', 'resizable=yes' );</script>
62 加載一個新的文檔到當前窗口
1: <a href='#' onClick='document.location = '125a.html';' >Open New Document</a>
63 設置頁面的滾動位置
1: <script language=”JavaScript”> 2: if (document.all) { //如果是IE瀏覽器則使用scrollTop屬性 3: document.body.scrollTop = 200; 4: } else { //如果是NetScape瀏覽器則使用pageYOffset屬性 5: window.pageYOffset = 200; 6: }</script>
64 在IE中打開全屏窗口
1: <a href='#' onClick=”window.open('http://www.juxta.com/','newWindow','fullScreen=yes');”>Open a full-screen window</a>
65 新窗口和父窗口的操作
1: <script language=”JavaScript”> 2: //定義新窗口 3: var newWindow = window.open(“128a.html”,”newWindow”); 4: newWindow.close(); //在父窗口中關閉打開的新窗口 5: </script> 6: 在新窗口中關閉父窗口 7: window.opener.close()
66 往新窗口中寫內容
1: <script language=”JavaScript”> 2: var newWindow = window.open(“”,”newWindow”); 3: newWindow.document.open(); 4: newWindow.document.write(“This is a new window”); 5: newWIndow.document.close(); 6: </script>
67 加載頁面到框架頁面
1: <frameset cols=”50%,*”> 2: <frame name=”frame1” src="/”135a.html"”> 3: <frame name=”frame2” src="/”about:blank"”> 4: </frameset> 5: 在frame1中加載frame2中的頁面 6: parent.frame2.document.location = “135b.html”;
68 在框架頁面之間共享腳本 如果在frame1中html文件中有個腳本
1: function doAlert() { 2: window.alert(“Frame 1 is loaded”); 3: }
那麼在frame2中可以如此調用該方法
1: <body onLoad=”parent.frame1.doAlert();”> 2: This is frame 2. 3: </body>
69 數據公用 可以在框架頁面定義數據項,使得該數據可以被多個框架中的頁面公用
1: <script language=”JavaScript”> 2: var persistentVariable = “This is a persistent value”; 3: </script> 4: <frameset cols=”50%,*”> 5: <frame name=”frame1” src="/”138a.html"”> 6: <frame name=”frame2” src="/”138b.html"”> 7: </frameset>
這樣在frame1和frame2中都可以使用變量persistentVariable 70 框架代碼庫 根據以上的一些思路,我們可以使用一個隱藏的框架頁面來作爲整個框架集的代碼庫
1: <frameset cols=”0,50%,*”> 2: <frame name=”codeFrame” src="/”140code.html"”> 3: <frame name=”frame1” src="/”140a.html"”> 4: <frame name=”frame2” src="/”140b.html"”> 5: </frameset>
|