必須在提交任何東西前按兩次Enter（或按鈕）

我有這個奇怪的小問題。我希望我的提交按鈕在提交時不做任何事情。所以我搜索了一下，發現了這段代碼。必須在提交任何東西前按兩次Enter（或按鈕）

<form id="search" onsubmit="myFunction(); return false;" > 
    <table> 
     <tr> 
      <td><input type="text" name="s" id="str" placeholder="Search"></td> 
      <td><button class="btn form-button btn-default"><i class="fa fa-search"></i></button></td> 
     </tr> 
    </table> 
</form>

代碼：onsubmit="myFunction(); return false;"防止Submit/reload和myFunction的運行此功能：

function myFunction() { 
    $('.form-button').on('click', function(){ 
     jQuery.fancybox({ 
      width : 600,   
      height: 600,  
      openEffect: 'fade', 
      closeEffect: 'fade',   
      href: 'search-post-results.php', 
      type: "ajax", 
       ajax: { 
        type: "POST", 
        data: { 
         value:$('#str').val() 
        } 
       } 
     }); 
    }); 
}

現在奇怪的是，像主題說。在發生任何事情之前，我必須點擊搜索按鈕或點擊返回兩次？任何人有任何想法，爲什麼這是happing？我搜索谷歌，但沒有什麼是連接到我的問題。我甚至在其他電腦上試過Chrome，FireFox和Opera。它總是一樣的。任何人？提前致謝！

來源

2017-06-23 Jay-oh

你怎麼看'myFunction的（）'做的第一線？ – nnnnnn

myFunction僅在點擊時觸發。你還添加了另一個點擊功能。所以這應該是問題。這應該是正確的功能

function myFunction() { 
      jQuery.fancybox({ 
       width : 600,   
       height: 600,  
       openEffect: 'fade', 
       closeEffect: 'fade',   
       href: 'search-post-results.php', 
       type: "ajax", 
        ajax: { 
         type: "POST", 
         data: { 
          value:$('#str').val() 
         } 
        } 
      }); 
    }

來源

2017-06-23 14:23:40

卓越！感謝您的快速回復！這工作。現在我覺得有點愚蠢 –

很高興聽到這個工作！謝謝！ –

雖然這是正確的邏輯，但我建議保留一個不顯眼的處理程序，而不是刪除過時的'on *'事件屬性。 –

的問題是，因爲你只安裝了jQuery click處理程序中的第一次點擊發生後調用的fancybox。您也在每次連續點擊中添加另一個點擊處理程序。

而不是在窗體的submit事件中使用單個事件處理程序。然後您也可以輕鬆阻止表單提交併同時顯示您的FancyBox。試試這個：

$(function() { 
    $('#search').on('submit', function(e) { 
    e.preventDefault(); 
    jQuery.fancybox({ 
     width: 600, 
     height: 600, 
     openEffect: 'fade', 
     closeEffect: 'fade', 
     href: 'search-post-results.php', 
     type: "ajax", 
     ajax: { 
     type: "POST", 
     data: { 
      value: $('#str').val() 
     } 
     } 
    }); 
    }); 
});

<form id="search"> 
    <table> 
    <tr> 
     <td> 
     <input type="text" name="s" id="str" placeholder="Search"> 
     </td> 
     <td> 
     <button class="btn form-button btn-default"> 
      <i class="fa fa-search"></i> 
     </button> 
     </td> 
    </tr> 
    </table> 
</form>

來源

2017-06-23 14:33:30

必須在提交任何東西前按兩次Enter（或按鈕）

回答

相關問題