JS表單傳值與URL編碼轉(zhuǎn)換的注意事項有哪些-創(chuàng)新互聯(lián)

小編給大家分享一下JS表單傳值與URL編碼轉(zhuǎn)換的注意事項有哪些，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

專注于為中小企業(yè)提供網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)潛山免費做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都，凝聚了一批互聯(lián)網(wǎng)行業(yè)人才，有力地推動了超過千家企業(yè)的穩(wěn)健成長，幫助中小企業(yè)通過網(wǎng)站建設(shè)實現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。

JS表單傳值與URL編碼轉(zhuǎn)換詳解的注意事項有哪些，下面就是實戰(zhàn)案例，一起來看一下。

注意：

這里寫了兩個網(wǎng)頁

因為URL傳過去的數(shù)據(jù)不支持中文字符和一些特殊符號所以需要轉(zhuǎn)換一下編碼

實現(xiàn)效果：網(wǎng)頁1的表單數(shù)據(jù)傳到網(wǎng)頁2并顯示出來

網(wǎng)頁1代碼如下：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
  <meta charset="UTF-8"> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
  <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
  <title>document</title> 
</head> 
<body> 
  <!--test_form.html為需要發(fā)送數(shù)據(jù)到的網(wǎng)頁,https://idaobin.com/test/test_form.html --> 
  <!--表單數(shù)據(jù)將通過method屬性附加到 URL上--> 
  <!--submit表單提交到另一個網(wǎng)頁--> 
  <form action="test_form.html" method="GET" target="_blank"> 
    賬號：<input type="text" name="code"><br> 
    姓名：<input type="text" name="str"><br> 
    <input type="submit"> 
  </form> 
</body> 
</html>

網(wǎng)頁2代碼如下：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
  <meta charset="UTF-8"> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
  <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
  <title>document</title> 
  <script type="text/javascript" src="jquery-3.2.1.js"></script> 
  <!--URL編碼轉(zhuǎn)換，只對第二個輸入框轉(zhuǎn)換--> 
  <script> 
    window.onload=function(){ 
      var a=document.getElementById("str").innerText; 
      var b=(decodeURIComponent(a)); 
      document.getElementById("str").innerText=b; 
    } 
    // 以下是jquery代碼 
    // $(function(){ 
    //   var c=$("#str").text(); 
    //   var d=(decodeURIComponent(c)); 
    //   $("#str").text(d); 
    // }); 
  </script> 
</head> 
<body> 
  <p>提交過來的數(shù)據(jù)頁面</p> 
  賬號：<span id="code"></span><br> 
  姓名：<span id="str"></span> 
</body> 
<!--獲取表單傳過來的數(shù)據(jù)--> 
<script> 
  function UrlSearch(){ 
    var name,value; 
    var str=location.href; 
    var num=str.indexOf("?"); 
    str=str.substr(num+1); 
    var arr=str.split("&"); 
    for(var i=0;i<arr.length;i++){ 
      num=arr[i].indexOf("="); 
      if(num>0){ 
        name=arr[i].substring(0,num); 
        value=arr[i].substr(num+1); 
        this[name]=value; 
      } 
    } 
  } 
  var Request=new UrlSearch(); 
  document.getElementById("code").innerHTML=Request.code; 
  document.getElementById("str").innerHTML=Request.str; 
</script> 
</html>

運行后：

JS表單傳值與URL編碼轉(zhuǎn)換的注意事項有哪些

以上是“JS表單傳值與URL編碼轉(zhuǎn)換的注意事項有哪些”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司行業(yè)資訊頻道！

網(wǎng)站題目：JS表單傳值與URL編碼轉(zhuǎn)換的注意事項有哪些-創(chuàng)新互聯(lián)
URL網(wǎng)址：http://aaarwkj.com/article28/dihccp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供小程序開發(fā)、關(guān)鍵詞優(yōu)化、電子商務(wù)、網(wǎng)站排名、外貿(mào)建站、搜索引擎優(yōu)化

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

欧美一级特黄大片做受成人-亚洲成人一区二区电影-激情熟女一区二区三区-日韩专区欧美专区国产专区

JS表單傳值與URL編碼轉(zhuǎn)換的注意事項有哪些-創(chuàng)新互聯(lián)