Question

当用户使用JQuery点击提交按钮时，我正在提交表单。但点击它多次提交相同的形式，我不知道为什么会发生这种情况。试了很多东西但失败了。以下是代码。

我正在下面添加我的PHP，Javascript和HTML代码。

HTML：

<div class="box-body big">
        <form id="pdf-generator" action="<?= $this->base; ?>/companies/generatePdf/" method="post" target="_blank">

            <select id="pdfname" class="form-control" name="pdfname">

                <option value="showfields">---Show Available Fields---</option>
                <option value="29300____test1.pdf">29300____test1.pdf</option>
            </select>
            <input type="hidden" name="fieldPairs" id="fieldPairs" value="" />
        </form>


        <div class="divide-12"></div>
        <button id="genPdfFormButton" type="button" class="btn btn-success pull-right">Generate PDF</button>
        <div class="divide-12"></div>
</div>

JS：

      $('#genPdfFormButton').click(function(){

      var elements = document.getElementsByTagName("input");
      var textAreas = document.getElementsByTagName("textarea");

      var list = "";
      var pair = "";

      document.getElementById("fieldPairs").value = '';
      //all input fields
      for (var i=0; i<elements.length; i++) {
          pair = elements[i].id + "=" + elements[i].value;
          list = (list.length == 0) ? pair : list + "|" + pair;
      }
      //all textareas
      for (var i=0; i<textAreas.length; i++) {
          pair = textAreas[i].id + "=" + textAreas[i].value;
          list = (list.length == 0) ? pair : list + "|" + pair;
      }

      document.getElementById("fieldPairs").value = list;

      $('#pdf-generator').submit();
  });

PHP：

public function generatePdf() {
    $this->log("==>===============[start]=====================", 'debug');
    $this->autoRender = false;

    $pdfName = $this->request->data['pdfname'];

    //get the submitted data
    $formData = $this->processFormData($this->request->data['fieldPairs']);

    if($pdfName == "showfields") { //show only form data fields
        var_dump($formData);
    } else { //generate PDF file

        $this->log("==> gonna call generatePdf <== ", 'debug');
        $pdf = new PdfForm(PDF.$pdfName, $formData);
        $pdf->download();
    }
}

当这段代码调用php函数时，我可以多次看到相同的日志消息，因为该函数被多次调用。

p.s：此问题不是多次点击提交按钮造成的。

Answer 1

每次用户点击提交时都应禁用该按钮

$('#genPdfFormButton').click(function(){
    $(this).prop('disabled', 'disabled');
    ...
}

Answer 2

因此，在浪费了大量时间并调试大量代码之后，我解决了这个问题。这是由于我的浏览器中安装了IDM（Internet Download Manager）扩展。我禁用了它，一切都按预期开始工作，功能现在只执行一次。

唷！

使用JS .submit执行多次相同的PHP函数

2 个答案: