如何在提交表单时使用jqueryajax发送请求而不重新加载页面

我这里有一个表单，要求用户输入一个值

<form id="result" name="result" action="/HelloStruts2/views/register.action" method="post">
    <label>UserName</label>
    <input type="text" name="userBean.username" value="" id="result_userBean_username"/>
    <input type="submit" id="registerSubmit" value="Submit"/>

</form>

当我提交表单时，表单正在被成功验证，而不是发送请求，整个页面正在被重新加载或刷新，我如何防止这种情况发生

更新 我已经用这个更新了我的脚本

$(document).ready(function(){
     $('#result').on('submit',function(e){
         e.preventDefault();
         $.ajax({
             //this is the php file that processes the data and send mail
             url: "register.action", 
             //GET method is used
             type: "POST",     
             //Do not cache the page
             cache: false,
             //success
             success: function (html) {              
                $('#content').html(html);       
             }       
         });
     })
})

---

但是，当我第二次单击按钮时，页面正在重新加载，而不是发送请求添加一个可以使用“e”的事件变量

加

e.preventDefault();

这将防止页面重新加载。所以你有：

$(document).ready(function(){
     $('#registerSubmit').live('click',function(e){
         e.preventDefault();
         alert("XD");
         $.ajax({
             //this is the php file that processes the data and send mail
             url: "register.action", 
             //GET method is used
             type: "POST",
             //pass the data           
             //Do not cache the page
             cache: false,
             //success
             success: function (html) {              
                 //if process.php returned 1/true (send mail success)
                $('#result').html(html);       
             }       
         });
     })
})

---

要停止提交（页面重新加载），请使用

preventDefault（）

但是，提交表单的方法不止一种，因此请不要绑定到实际可能不用于提交表单的按钮。在您的示例中，如果我在文本字段中按enter键，将在表单上触发提交；任何绑定到提交按钮的事件都不会被捕获，重要脚本也不会执行

$(document).ready(function(){
     $('#result').live('submit',function(e){ // e is the event
           e.preventDefault(); // stop the event's default action
           alert("XD");
           ...

旁白：

live（）
贬值的原因非常充分。在（）上使用
on

如果表单已经存在（在执行JS时），只需替换
live（）

或者，如果它是动态生成的，您必须绑定到已经存在的某个对象，其结果将最终位于

$(document).on('submit', '#result', function()...

编辑

鉴于更新的代码和新的问题，我怀疑id为result的表单存在于任何具有id内容的元素中，在这种情况下on（）需要修复到已经存在的元素，正如我前面提到的。在这种情况下，
#content
是合适的元素

$('#content').on('submit', '#result', function()...

使用jQuery.click函数并放置event.preventDefault（）以停止进入表单操作页面。
提交表单的方法不止一种，因此，请不要绑定到实际可能不用于提交的按钮。结果是否存在于内容中？具有id结果的表单是否存在于具有id内容的任何元素中？我想是的，请参阅我的编辑。为什么您更喜欢使用提交而不是onclick？操作绑定到表单而不是按钮。使用“单击”意味着用户单击表单中提交的任何位置。在您的示例中，如果我在文本字段中按enter键，表单上会触发提交；任何绑定到“提交”按钮的事件都不会执行。我没有执行您的建议，但如果我两次单击该按钮，整个页面将重新加载。但在第一次提交时，它是有效的。不，它会破坏问题，但你可以将它添加到问题中
$('#result').on('submit', function...

$(document).on('submit', '#result', function()...

$('#content').on('submit', '#result', function()...

    $('#registerSubmit').click(function(e){
        e.preventDefault();
    });