表单页面中的ajax请求问题。 jQuery答案

【问题标题】：problems with ajax request in page with form. jquery表单页面中的ajax请求问题。 jQuery
【发布时间】：2010-10-25 15:41:47
【问题描述】：

我正在使用 jQuery ajax 函数做一些事情，当我将表单放在 html 中间时出现问题。
简而言之：我有一个由 ajax 控制的虚拟表单，当它被提交时，ajax 函数会完成下面的输入。 ajax 提交的数据包含在表单标签中，当点击表单外的按钮时提交该标签。我这样做是因为我需要以两种不同的方式发送相同的数据。
代码：
HTML

<input type="button" value="Exportar a Excel" id="xlsexport">
<form action="#" method="post" name="formxls" id="formxls">
    <div class="row">
        <input type="hidden" id="xls" name="xls" value="">
        <div class="item"><span class="negro">Nombre:</span></div>
        <div class="field"><input class="input" id="nombreProv" type="text" /></div>
        <div class="item"><span class="negro">CUIT:</span></div>
        <div class="field"><input class="input" id="cuitProv" type="text" /></div>
        <div class="field"><input type="image" id="btnEnviar" value="Enviar Prov." src="images/botones/mini_send.png" style="margin-top: -1px; margin-left: 8px;" ></div>
    </div>
</form>
... Some inputs below ...

jQuery：

$('document').ready(function(){
   $('#formxls').keypress(function(e){ // it prevents the form will send by pressing enter 
      if(e == 13){
         return false;
      }
    });
   $('#xlsexport').click(function(){
      $('#xls').val('true');
      $('#formxls').submit();
   });
   $('input#btnEnviar').click(function(){
      if($('#xls').val() == 'true') $('#xls').val('');
      $('div#selectData').empty().removeAttr('style');
      $.ajax({ 
          // ajax request code
      });

问题是：
当我通过按钮“xlsexport”提交表单时，一切都很好，但是，当我通过 ajax 按钮（“btnEnviar”）提交表单时，它会执行它应该做的事情，然后发送表单，所以我丢失 ajax 加载的所有数据。
我该如何解决？还有其他方法可以做到这一点吗？这是一种毫无意义的行为（至少对我而言），因为除了 xlsexport 点击事件中的提交之外，我没有其他提交。

我希望我说清楚了，你可以帮我解决这个问题。

非常感谢！

【问题讨论】：

标签： html ajax forms jquery

【解决方案1】：

它可能需要其他输入字段中的name 属性（只有隐藏的输入有一个）。

【讨论】：

我需要做的是避免在ajax执行后发送表单。有什么办法可以做到吗？
尝试添加event.preventDefault();作为按钮代码的最后一行，在ajax代码之后。
我成功了！我的错误是从来没有在 click 函数中定义事件参数。所以我这样做了： $('input#btnEnviar').click(function(e){ $.ajax({...}); e.preventDefault(); 非常感谢！

【解决方案2】：

您可以定义一个 onSubmit 函数并检查单击按钮的值，如果是“btnEnviar”则返回 false。布埃纳苏尔特。

【讨论】：

我做了一个总是返回 false 的函数，我把它放在表单 onsubmit 事件中。 ajax加载数据后，光标进入了我做的onsubmit函数，但是表单发送了信息。 Con esto, la buena suerte no esta de mi lado :(