JavaScript實現在頁面間傳值的方法_javascript技巧

來源:互聯網
上載者:User

本文執行個體講述了JavaScript實現在頁面間傳值的方法。分享給大家供大家參考。具體如下:

問題如下:

在 a.html 頁面中,<form> 的 onsubmit 事件調用一個方法 foo( ),開啟 b.html 頁面的同時給 b.html 傳遞參數。方法 foo( ) 中需要傳遞變數參數到 b.html 頁面,在 b.html 頁面接受參數值,但不能使用伺服器端技術。

解決代碼如下:

a.html頁面如下:

<html><head>  <title> demo </title>  <meta name="Author" content="xugang" />  <script type="text/javascript">  function foo(){   var a ="abc"; // a為變數值   var str = "b.html?id="+a+";";   //alert(document.frm.action);   //方案一(無效)   // document.frm.action = str;   //方案二(無效)   // window.location.href = str;   //方案三(有效)   window.location.replace(str);   return false;  } </script></head><body>   <FORM name="frm" method="get"    onsubmit = "return foo()" >      <INPUT TYPE="SUBMIT" />   </FORM></body></html>

注意:必須 b.html 頁面事先存在即可。

b.html 獲得參數值的代碼如下:

b.html 部分代碼

var getQueryString = function(name) {  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");  var r = window.location.search.substr(1).match(reg);  if (r != null) return r[2]; return "";}

補充:

myjs.js 代碼:

function foo(){     var str = "abc";     //document.forms[0].hid.value = str;     var frm = window.event.srcElement;     frm.hid.value = str;     return true; }

a.html 代碼:

<html> <head>  <title> demo </title>  <meta name="Author" content="xugang" />  <script src="myjs.js"></script> </head> <body>  <FORM name="frm" METHOD="get" ACTION="b.html"  onsubmit="return foo()">   <INPUT TYPE="hidden" id="hid" name="hid">   <INPUT TYPE="submit" value="提交">  </FORM> </body> </html>

注意:給 b.html 頁面傳值時,b.html 頁面必須事先已存在!

b.html 代碼:

<HTML>  <HEAD>   <TITLE> New Document </TITLE>  </HEAD>  <BODY>   <SCRIPT LANGUAGE="JavaScript">    document.write(decodeURIComponent(location.search.substr(3)));  </SCRIPT>  </BODY> </HTML>

希望本文所述對大家的javascript程式設計有所協助。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.