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>

如果用户首先进行空输入并尝试提交错误，msg将显示..但即使使用有效输入，click事件也不会触发（我知道这是因为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

不使用'one'以便只调用一次处理程序，而是将处理程序声明为命名函数，并使用jQuery的bind / unbind删除单击处理程序，如果（并且仅当）字段具有有效值时表格已提交。否则，请继续监听click事件。就这样：

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);

或者，如果你仍想使用'one'，你可以调整前一个例子，如下：

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);

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

尝试绑定事件，

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

});

Jquery一个问题

5 个答案: