Question

初学者程序员在这里。试图在JSP中创建一个非常原语＆＃34;聊天界面＆＃34;，在我输入某些单词的时候，它们存储在一个数组中，然后理想地吐出来同一页面。我的代码有点工作，但它加载到一个新页面。

我尝试了很多不同的东西，我在网上阅读，包括尝试添加＆＃34;返回false＆＃34;到我的showChats功能，尝试将提交更改为按钮并执行＆＃34; onclick＆＃34;，但它仍无法正常工作，始终会加载新页面。关于如何解决这个问题的任何想法？

提前致谢。这是代码：

<script>

counter = 0;

//Array containing initial elements.
var chats = [];

function show_array(array) {
    array[counter] = document.getElementById("chatlet").value;
    for (x = 0; x < array.length; x++){
        document.write(array[x] + "<br/>");
    }
    counter++;
}

</script>

<form action="agenda2.jsp" method="get" onsubmit="show_array(chats)" >
    <p>
        <textarea id="chatlet" rows="10" cols="30"></textarea>
    </p>
    <input type="submit" value="Send Chat">
</form>


</body>
</html>

Answer 1

在函数show_array（）的最后，你必须添加return false;或者在其他情况下，你可以使用jQuery来调和并执行此操作：

为表单添加课程或ID

<form class="myform">
....
</form>

<script>
    $("myform").on('submit', function(e) {
        e.preventDefault();   
    });
</script>

问候！

Answer 2

您需要在return中添加onsubmit关键字，例如onsubmit="return show_array(chats)"，然后在{j}中添加return false。

<强>代码：

<form action="agenda2.jsp" method="get" onsubmit="return show_array(chats)" >

<强> JS

counter = 0;
var chats = [];
function show_array(array) {
    array[counter] = document.getElementById("chatlet").value;
    for (x = 0; x < array.length; x++) {
        document.write(array[x] + "<br/>");
    }
    counter++;
    return false;
}

<强> DEMO

Answer 3

使用查询，您可以在下面执行

$('form').submit(function (e) {
    e.preventDefault();

    $.ajax({
      type: "POST",
      url: $(this).attr('action'),
      data: 'get form data',
        success: function (res) {
            // handle response here
        }
    });
});

Javascript表单提交到新页面 - 如何将其保留在同一页面上？

3 个答案: