Javascript 当我点击按钮时，我无法阻止网页发布_Javascript_Html_Css

Javascript 当我点击按钮时，我无法阻止网页发布

javascript html css

Javascript 当我点击按钮时，我无法阻止网页发布,javascript,html,css,Javascript,Html,Css,我已经研究了关于堆栈溢出的多种解决方案，其中没有一种有效当我点击这个按钮时，它会把我带到一个新的url yoursite.com/index.html？message=blah&pass=12 我希望它保持在同一页上，只执行我编写的脚本请帮忙 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Simple Encryp

我已经研究了关于堆栈溢出的多种解决方案，其中没有一种有效

当我点击这个按钮时，它会把我带到一个新的url 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>


使用Caesar的简单加密
.隐藏{
可见性：隐藏；
}
这是什么？
此应用程序用于使用Caesar方法加密数据。
所有加密都在客户端处理，以保证数据的完整性
在以下框中插入一些文本：



输入您最喜爱的号码



让我们加入
window.onload=函数（）{doStuff（）；}；
函数doStuff（）{
document.getElementById（“加密”）.onclick=function（）{
var key=document.getElementById（“pass”）.value；
var message=document.getElementById（“userText”）.innerHTML；
var-eMessage=caesarShift（消息、键）；
document.getElementById（“emessage”）.innerHTML=emessage；
}
}

我有另一个名为encrypt.js的js文件，它有一个名为

caesarShift（）

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

将

event.preventDefault

更改为

event.preventDefault（）

前者仅引用函数，而后者实际调用函数。

将

event.preventDefault

更改为

event.preventDefault（）

前者只引用函数，而后者实际调用函数。

我对代码做了一些修改，使其更易于执行您要查找的内容

您需要定义要调用的

caesarShift

函数。除非您在div

emessage

中定义您将无法得到您要查找的答案

如果只想使用方法，然后定义

caesashift

并调用它，则还需要更改为

event.PreventDefault（）

。 HTML部分-->


在以下框中插入一些文本：



输入您最喜爱的号码



让我们加入

JS部分-->


函数doStuff（）{
var key=document.getElementById（“pass”）.value；
var message=document.getElementById（“userText”）.value；
//定义这个移位函数
var-eMessage=caesarShift（消息、键）；
document.getElementById（“emessage”）.innerHTML=emessage；
}
//window.onload=函数（）{doStuff（）；}；

我对代码做了一点修改，使它更容易完成您要查找的内容