Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/408.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 干掉JS代码并隐藏地址栏上的输入?_Javascript_Html - Fatal编程技术网

Javascript 干掉JS代码并隐藏地址栏上的输入?

Javascript 干掉JS代码并隐藏地址栏上的输入?,javascript,html,Javascript,Html,我有一个脚本,可以将用户的输入传递到completed.html页面,但这里有两个问题: 所有用户输入都显示在地址栏上,我想隐藏它,但我不想使用POST方法,这会破坏我的JS脚本的用途。即使我必须更改JS脚本,是否有任何方法可以在不更改方法的情况下隐藏这些输入 我的JS代码真的很重复,重复了4次,我想知道一种更好的方法来编写它,而不需要到处复制和粘贴 index.html <div id="container"> <header> <h1&g

我有一个脚本,可以将用户的输入传递到completed.html页面,但这里有两个问题:

  • 所有用户输入都显示在地址栏上,我想隐藏它,但我不想使用POST方法,这会破坏我的JS脚本的用途。即使我必须更改JS脚本,是否有任何方法可以在不更改方法的情况下隐藏这些输入

  • 我的JS代码真的很重复,重复了4次,我想知道一种更好的方法来编写它,而不需要到处复制和粘贴

  • index.html

    <div id="container">
        <header>
            <h1>Registration Form</h1>
            <hr>
        </header>
        <article>
            <form action="completed.html" method="GET">
                <label for="FirstName"><b>First Name:</b></label>
                <input name="FirstName" type="text" placeholder="John" required>
                <label for="LastName"><b>Last Name:</b></label>
                <input name="LastName" type="text" placeholder="Doe" required>
                <label for="email"><b>Email:</b></label>
                <input name="email" type="text" placeholder="example@mail.com" required>
                <label for="password"><b>Password:</b></label>
                <input name="password" type="password" placeholder="Password here." required>
                <p></p>
                <input type="submit" value="Submit">
            </form>
        </article>
        <footer>
            Copyright @ 2017 Name
        </footer>
    </div>
    
    
    登记表
    
    名字: 姓氏: 电邮: 密码:

    版权所有@2017 Name
    completed.html

    <div id="container">
        <header>
            <h1>Registration Completed!</h1>
            <hr>
        </header>
        <article>
            <div id="info" style="float: left;">
                <p>Thank you for registering on our site! An verification email has been seen to your email address! To make sure we got everything right, we would like you to review the infomation you've put in.</p>
                <div id="fn">
                    Your First Name is:
                </div>
                <div id="ln">
                    Your Last Name is:
                </div>
                <div id="em">
                    Your email is:
                </div>
                <div id="pw">
                    Your password is:
                </div>
            </div>
        </article>
        <footer>
            Copyright @ 2017 Name
        </footer>
    </div>
    <script>
        function processForm() {
            var ary = location.search.substring(1).split("&");
    
            var fnpart = ary[0].split("=");
            frn = unescape(fnpart[1]);
            document.getElementById("fn").innerHTML = "<b>Your First Name is:</b>" + "<br>" + frn;
    
            var lnpart = ary[1].split("=");
            lsn = unescape(lnpart[1]);
            document.getElementById("ln").innerHTML = "<b>Your Last Name is:</b>" + "<br>" + lsn;
    
            var empart = ary[2].split("=");
            ema = unescape(empart[1]);
            document.getElementById("em").innerHTML = "<b>Your Email is:</b>" + "<br>" + ema;
    
            var pwpart = ary[3].split("=");
            psw = unescape(pwpart[1]);
            document.getElementById("pw").innerHTML = "<b>Your First Name is:</b>" + "<br>" + psw;
        }
        processForm();
    </script>
    
    
    注册完成!
    
    感谢您在我们的网站上注册!已向您的电子邮件地址发送验证电子邮件!为了确保一切正常,我们希望您查看您输入的信息

    你的名字是: 你的姓是: 您的电子邮件是: 您的密码是: 版权所有@2017 Name 函数processForm(){ var ari=location.search.substring(1.split(“&”); var fnpart=ary[0]。拆分(“”); frn=unescape(第[1]部分); document.getElementById(“fn”).innerHTML=“您的名字是:“+”
    “+frn; var lnpart=ary[1]。拆分(“”); lsn=unescape(lnpart[1]); document.getElementById(“ln”).innerHTML=“您的姓是:“+”
    “+lsn; var empart=ary[2]。拆分(“”); ema=unescape(empart[1]); document.getElementById(“em”).innerHTML=“您的电子邮件是:“+”
    “+ema; var pwpart=ary[3]。拆分(“”); psw=unescape(pwpart[1]); document.getElementById(“pw”).innerHTML=“您的名字是:“+”
    “+psw; } processForm();
    您可以尝试使用如下模式,使用循环索引匹配短名称/长名称中的位置:

    但是密码不应该像现在一样在该位置可见

    var names = [['fn', 'First Name'], 
                 ['ln', 'Last Name'],
                 ['em', 'Email'],
                 ['pw', 'Password']
                ]
    
    for (ind in ary){
      var part = unescape(ary[ind].split("=")[1]);
      document.getElementById(names[ind][0]).innerHTML = "<b>Your "+ names[ind][1] + " is:</b> <br>" + part;
    
    }
    
    var Name=[['fn','First Name'],
    ['ln','Last Name'],
    ['em','Email'],
    ['pw','Password']
    ]
    for(在ary中为ind){
    var part=unescape(ari[ind].split(“=”[1]);
    document.getElementById(names[ind][0]).innerHTML=“Your”+names[ind][1]+”是:
    “+部分; }
    要实现目标1,您不需要在
    表单上使用属性
    操作
    。您还可以将提交按钮替换为
    ,处理单击事件并调用
    processForm()
    函数


    为了能够调用该函数,您需要将
    processForm()
    声明移动到index.html中。所以你只需要一个文件。您不需要从查询字符串中读取任何数据。只需从DOM元素读取输入值

    您就不能使用浏览器存储来存储数据,并使用
    Ajax-GET
    请求发送相同的数据。您始终可以读取Cookie、localstorage、sessionstorage等。您的表单已经有了方法,即
    GET
    ,这显然是在URL中显示参数。感谢脚本的修改,但输入仍然可见。我删除了所有的4个变量并粘贴了代码,这样正确吗?@MatiasTresch对不起,我第一个目标是瞎的,我只分解了代码,你尝试过Zamrony-p-juhara的建议吗?Zamrony技术很好,他使用了1页,但我更喜欢2页的方式。有办法吗?因为我必须这样做,以使它以他的方式改变整个页面布局(文本)。@MatiasTresch我看不到没有POST方法的方法。好的,你能用POST方法实现相同的结果吗?谢谢你的建议。但是有没有一种方法我可以用两页分开的纸来做呢?这个答案没有意义。你能解释一下为什么没有意义吗?