首页 > 解决方案 > 单击按钮时,我无法阻止网页发布

问题描述

我查看了有关堆栈溢出的多种解决方案,但没有一个有效。

当我点击按钮时,它会将我带到一个新的网址 yoursite.com/index.html?message=blah&pass=12

我希望它保持在同一页面中并执行我编写的脚本。

请帮忙

<!DOCTYPE html>

<html>  
    <head>
        <meta charset="UTF-8">
        <title>Simple Encryption Using Caesar</title>
        <link rel="stylesheet" href="https://unpkg.com/marx-css/css/marx.min.css">

        <style>
            .hidden{
                visibility: hidden;
            }

        </style>
        <script src="encrypt.js"></script> 



    </head>
    <body>
        <main>
            <h2>What is this?</h2>

            <p>This application was built to <b>encrypt</b> data using the <b>Caesar method.</b>
                 All encryption is handled on <i>client side</i> in order to garuntee <b>data integrity.</b> </p>


            <form onsubmit=" event.preventDefault; doStuff(); ">
                <h5>Insert some text in the following box:</h5> <br>
                <textarea id="userText" name="message" cols="30" rows="10" placeholder="Your secret message" autofocus></textarea>
                <br>
                <h5>Enter Your Favorite Number</h5> <br>
                <input type="text" name="pass" id="pass" placeholder="Enter Your Favorite Number:"> <br>


                <button id="encrypt" type="submit" onclick="return false;" style="width: 100%;">Lets Encrpt</button>

                <div id="emessage"></div>

            </form>



        </main>

        <script>

            window.onload = function(){ doStuff(); };

            function doStuff(){
                document.getElementById("encrypt").onclick = function(){

                    var key = document.getElementById("pass").value;
                    var message = document.getElementById("userText").innerHTML;

                    var eMessage = caesarShift(message,key);

                    document.getElementById("emessage").innerHTML = eMessage ;




                    }
            }




        </script>



    </body>

</html>

我有另一个名为 encrypt.js 的 js 文件,它有一个名为caesarShift()

我不知道为什么这不起作用。请帮忙!

标签: javascripthtmlcss

解决方案


更改event.preventDefaultevent.preventDefault()

前者仅引用该函数,而后者实际调用它。


推荐阅读