提交按钮通过JQuery和JavaScript函数所做的更改不会持续

Changes made by submit button via JQuery and JavaScript function do not last

本文关键字：按钮 JQuery 函数 JavaScript 提交      更新时间：2023-09-26

我正在尝试使用document.write（）方法在文档上写一些文本。问题是，当用户点击按钮时，我希望这个文本写在那里，并在用户点击按钮后保持在那里。我现在遇到的问题是，文本出现了一段时间，然后在函数执行完毕后消失，这是我不想也不知道如何解决的问题

    <!DOCTYPE html>
    <html lang="en">
       <head>
         <title>Learning JQuery</title>
         <meta charset="utf-8" />
         <script src="jquery.js" type="text/javascript"></script>
         <script type="script.js">
            $(document).ready(function(){
              $("input").click(function(){
                for(var i = 0; i < 10; i++){
                  for(var j = 0; j < i; j++){
                    document.write("*");
                  }
                   document.write("<br/>");
                }
                //alert("click to continue");
              });
            });
         </script>
       </head>
       <body>
         <p>Body section of the page</p>
         <form>
           <input type="submit" value="clickMe" />
         </form>
       </body>
    </html>

文本"出现一段时间，然后消失"，因为提交按钮中的type="submit"会刷新页面。

如果您试图阻止刷新页面，则可以使用preventDefault()。

        $(document).ready(function(){
          $("input").click(function(e){
            e.preventDefault();
            for(var i = 0; i < 10; i++){
              for(var j = 0; j < i; j++){
                document.write("*");
              }
               document.write("<br/>");
            }
            //alert("click to continue");
          });
        });

以下是一个示例

或者，如果您实际上没有提交表单数据，您可以使用普通按钮：

<button id="button">Click Me</button>

然后在单击按钮时激发js：$("#button").click(function(e){ ... });

使用下面的

在尸体上放一个潜水器。

<div id="my-div"></div>

然后在你的代码中，你可以点击

  e.preventDefault();
  for(var i = 0; i < 10; i++){
    for(var j = 0; j < i; j++){
      $('#my-div').append("*");
    }
    $('#my-div').append("<br/>");
  }
相关文章：