jQuery的一個問題

Question

我的標記

<form action="blah/foo" method="POST" id="frm1"> 
<input type="hidden" id="v" /> 
</form> 
...... 
...... 
<!--after some code--> 
<button id="btn1">test</button> 
<input type="text" id="somevalue" /> 

我的目的是，當我按一下按鈕BTN1，抓鬥somevalue價值，並給它隱藏的價值v並提交表單，表單需要提交（僅一次），所以我使用了jQuery one方法和多數民衆做工精細

第二件事情是，如果somevalue是空的，我不希望提交

的問題場景

<script> 
$('#btn1').one('click',function(){ 
    if(!$('#somevalue').val()){ 
    $('p#msg').html('Empty value'); 
    return false; 
    } 
    $('#frm1').submit(); 

}); 
</script> 

IF用戶首先進行一個空的輸入和嘗試提交錯誤味精，即使有一個有效的輸入的單擊事件不會觸發後會show..but（我知道是因爲one功能的多數民衆贊成）

進出口尋找一些替代的形式將提交一次

Answer 1

var form_sent = false; 
$('#btn1').click(function(){ 
    if(form_sent == true){ return; } 
    if(!$('#somevalue').val()){ 
     $('p#msg').html('Empty value'); 
     return false; 
    } 
    form_sent = true; 
    $('#frm1').submit(); 
}); 

Answer 2

嘗試綁定事件，

$('#btn1').bind('click',function(){ 
    if(!$('#somevalue').val()){ 
    $('p#msg').html('Empty value'); 
    return false; 
    } 
    $('#frm1').submit(); 

});​ 

Answer 3

嘗試：

$('#btn1').one('click',function(){ 
    callFunc(); 
}); 

function callFunc(){ 
if($('#somevalue').val() == ""){ 
    $('p#msg').html('Empty value'); 
    $('#btn1').one('click',function(){ callFunc(); }); 
    return false; 
    } 
$('#frm1').submit(); 
} 

Answer 4

首先，爲什麼沒有你的表單輸入？是否有特定的理由這樣做？

也爲此在直接的JavaScript，而不是使用jquery我會做的事情如下：

<form action="blah/foo" method="POST" id="frm1" onsubmit="return validateForm();"> 

的validateForm只是檢查是否輸入是空的，如果是則返回false，否則它返回true。將false返回給onsubmit將停止提交表單。

Answer 5

而不是使用'one'，以便您的處理程序只被調用一次，將您的處理程序聲明爲命名函數並使用jQuery的綁定/解除綁定來刪除單擊處理程序，如果（且僅當）字段具有有效值表單提交時。否則，請繼續收聽點擊事件。因此：

function onFormSubmitted (e) { 
    if($("#somevalue").val === "") { // If the field's value is invalid... 
     $('p#msg').html('Empty value'); // ... then show error message... 
     return; // ...and do nothing else - just keep on listening 
    } 

    // Ok, we have valid input so... 
    $('#btn1').unbind("click", onFormSubmitted); // ...stop listening... 
    $("#frm1").submit(); // ...and submit the form 
} 

// Start listening for the click event 
$('#btn1').bind("click", onFormSubmitted); 

或者，如果你仍然想使用「一」，你可以調整前面的例子，因爲這樣的：

function onFormSubmitted (e) { 
    if($("#somevalue").val === "") { // If the field's value is invalid... 
     $('p#msg').html('Empty value'); // ... then show error message... 
     $('#btn1').one("click", onFormSubmitted); // ...re-attach one-time listener... 
     return; // ...and wait 
    } 

    // Ok, we have valid input so don't re-attach one-time listener... 
    $("#frm1").submit(); // ...just submit the form 
} 

// Add one-time listener for the click event 
$('#btn1').one("click", onFormSubmitted);