Question

如何在不离开当前页面的情况下按下按钮（<input type="button">但不<input type="submit">），并且不刷新它并在成功时显示消息，例如“您的表单已成功发送” ！“？我想我需要使用jQuery ....不是吗？

我正在使用此代码：

<form name="myform" action="SendForm.jsp" method="post">
   Username: <input type="text" name="user">
   <input type="button" id="b1" value="Send">
</form>

提前致谢！

Answer 1

如果您不想刷新页面，则需要ajax。

jQuery中的DEMO

<form name="myform" action="SendForm.jsp" method="post" id="myForm">
   Username: <input type="text" name="user">
   <input type="button" id="b1" value="Send">
</form>

$("#b1").on("click", function(){
    $.ajax({
        url: 'SendForm.jsp',
        type: 'POST',
        data: $("#myForm").serialize(),
        success: function(){
            alert("Your form has been successfully sent!");
        }
    });
});

Answer 2

如果您需要使用按钮类型。在“发送”按钮中，您将添加一个onclick事件

<input type="button" id="b1" value="Send" onclick="myfunction();">

然后你会编写一个使用AJAX发送数据的JS函数

function myfunction() {
    jQuery.ajax({url: 'my/url/here'}).done(function () { /*do something here*/ });
}

按下按钮（<输入类型=“按钮”/>但不是<输入类型=“提交”/>）并发送表格但不要离开当前页面

2 个答案: