爲什麼我的表單在「返回」按鈕上提交？

-3

我有一個表單，其中包含7個輸入字段，分別顯示'下一個按鈕'以顯示下一個輸入和隱藏當前和'後退按鈕'以隱藏當前並顯示前一個。問題在於當我點擊'後退按鈕'時，最後一個輸入的提交功能會運行，並且它會將未完成的字段保存在數據庫中。我不知道爲什麼以及如何預防它。這裏是 '後退按鈕' 的示例代碼：爲什麼我的表單在「返回」按鈕上提交？

Template.submitProblem.events({ 
    'click .back1':function() { 
    //show/hide items with removeClass()/addClass() 
    $('#submit-why1').addClass('hidden'); 
    $('#submit-problem').removeClass('hidden'); 
    } 
});

，並在最後輸入字段提交功能：

Template.submitProblem.events({ 
    'submit form':function(event) { 
    event.preventDefault(); 
    var problem = $(event.target).find('[name=problem]').val(); 
    var why1 = $(event.target).find('[name=why1]').val(); 
    var why2 = $(event.target).find('[name=why2]').val(); 
    var why3 = $(event.target).find('[name=why3]').val(); 
    var why4 = $(event.target).find('[name=why4]').val(); 
    var why5 = $(event.target).find('[name=why5]').val(); 
    var solution = $(event.target).find('[name=solution]').val(); 

    Problems.insert({ 
     problem: problem, 
     why1: why1, 
     why2: why2, 
     why3: why3, 
     why4: why4, 
     why5: why5, 
     solution: solution, 
     submitdate: new Date() 
    }); 

    Router.go('submitted'); 
    } 
});

<template name="submitProblem"> 
 
    <div class="container"> 
 
    <div class="main-page"> 
 
     <form class="form text-center"> 
 
     <div id="submit-problem"> 
 
      <input autofocus="autofocus" type="text" name="problem" id="problem" placeholder="What's the problem ?"/> 
 
      <input type="button" id="route" value="Find Its Route" class="route btn btn-sample"> 
 
     </div> 
 

 
     <div id="submit-why1" class="hidden"> 
 
      <input autofocus="autofocus" type="text" name="why1" id="why1" placeholder="This problem exists, because..."/> 
 
      <input type="button" value="Answer" class="btn-success btn answer1"> 
 
      <div> 
 
      <button class="btn back1 back-btn"><i class="fa fa-arrow-left fa-3x"></i></button> 
 
      </div> 
 
     </div> 
 
     ...

來源

2015-03-18 mhlavacka

我從snippets功能中刪除了您的代碼，因爲沒有任何HTML沒有運行。 – Sparky 2015-03-18 23:21:42

我也不明白你爲什麼用CSS標記問題。請勿在此網站上加上垃圾郵件。謝謝。 – Sparky 2015-03-18 23:22:35

請使用_button_標籤顯示您的html – 2015-03-18 23:22:46

你應該總是指定<button>元素的類型屬性，因爲不同的瀏覽器可能會爲<button>元素使用不同的默認類型。在你的情況下，你需要更新你的後退按鈕有一個類型按鈕，因此它不提交。

<button type="button" class="btn back1 back-btn"><i class="fa fa-arrow-left fa-3x"></i></button>

來源

2015-03-19 00:43:15

爲什麼我的表單在「返回」按鈕上提交？

回答

相關問題