html之间传值

作者: Vincy_ivy | 来源:发表于2019-04-24 12:21 被阅读0次

html之间传值
组件之间的传值之非父子（同级之间的传值用第三方量）
组件通信
vue通信、传值的多种方式
两个静态HTML互相传值
组件之间的传值
vue中的组件
ios常用的三种传值方式
swift传值
Vue.js 父子组件传值 . 兄弟组件传值

我们真的是无所不能，没有学过的语言居然因为web，什么都学了一遍。web的课还是要认真听的，老师讲了好多好多听不懂的函数

实验10

请设计一个提交表单的页面：form.html，可以让用户输入相关的基本信息，如下图1所示。当点击“提交”后，跳转到action.html页面，在action.html页面显示用户提交的相关信息，用表格显示出来，如图2所示。

图1

图2

form.html

 <!DOCTYPE html>
 <html>
 <head>
        <meta charset="UTF-8">

       <title></title>

  </head>
  <body>
    <fieldset >
        <legend>提交个人基本信息</legend>
        <form action="action.html" onload="action.js" method="get" >

      //CARE CARE 这里一定要有name属性 不然在js中无法传值，终于跳出坑的感觉真好

                请输入你的用户名<input type="text" name="name" /><br />
                请输入你的邮箱地址：<input type="text" name="mail" /><br />
                请选择性别<input type="radio"  name="sex" value="male" checked/>男
                <input type="radio" name="sex" value="female" />女<br />
                请选择你的年龄：<input type="number" name="age" /><br />
                <input type="submit" value="提交" />
        </form>
    </fieldset>
    
</body>
</html>

action.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="action.js" ></script>
    </head>
    <body onload="showURL()">              
    
    </body>
</html>

action.js

 function showURL(){
    //关键,这里已经全部获取了
    var urlStr = location.search;
    console.log(urlStr);
    urlStr=urlStr.substring(1);
    console.log(urlStr);
    var urlName = new Array();//用户名
    var urlValue = new Array();
    var urlArr = new Array();

    urlArr = urlStr.split("&");
    console.log(urlArr);

    for(var i=0;i<urlArr.length;i++){
        urlName[i]=urlArr[i].split("=")[0];//等于号左边
        urlValue[i]=urlArr[i].split("=")[1];//等于号右边
    }
    document.write("<table border='1' width='100'>");//创建表格
    document.write("<tr>");
    for(var j=0;j<urlName.length;j++){
        document.write("<th>"+urlName[j]+"</th>")
    }
    document.write("</tr>");
    document.write("<tr>");
    for(var m=0;m<urlValue.length;m++){
        document.write("<td>"+urlValue[m]+"</td>");
    }
    document.write("</tr>");

}