提交表单，但只允许一次

我都设置窗体的行动，并通过的onclick事件一个div的提交形式：提交表单，但只允许一次

<div class="action_button" onclick="document.forms['test'].action='url/to/action';document.forms['test'].submit()"> 
<span class="action_button_label">Save</span> 
</div>

这工作得很好，但我想要使用一些有条件地检查action_label_button中的'Save'的代码，并且只允许submit（）触发一次。我试图阻止多次保存（这是在我的应用程序产生重复的数据）发生。

// disable save buttons onclick (prevent multiple clicks of save buttons) 

$('.action_button_label').one('click', function() { 
    // if the button is a save button 
    if($(this).html().indexOf('Save') != -1) { 
     // submit the parent form 
      $(this).html('<span class="action_button_label" style="color:gray;">Saving...</span>'); 
      $(this).parents('form').submit(); 
    } 
}); 

$('form').bind('submit', function() { 
    $(this).find('action_button').attr('onclick', ''); 
});

此代码似乎并没有按照我的预期工作。恐怕我在这里有点出乎我的意料，任何指针都会很棒。

来源

2013-09-25 David Angel

您可能只想禁用该按钮，直到事件结束。 – 2013-09-25 14:54:35

请为此创建一个[jsfiddle]（http://jsfiddle.net），以便我们可以查看您的代码并与其进行交互。 – jwarner112

这里是小提琴：http://jsfiddle.net/davidangel/V5zKS/ –

尝试

$(this).find('.action_button').attr('onclick', '');

来源

2013-09-25 14:54:20 Brian

哦，当然这是一种愚蠢的东西。谢谢！ –

更换

$(this).find('action_button').attr('onclick', '');

你应该总是处理多次提交服务器端，以确保你没有得到他们。不过，您可以隐藏按钮标签以协助客户端。

$('.action_button_label').one('click', function() { 
    // if the button is a save button 
    if($(this).html().indexOf('Save') != -1) { 
     // submit the parent form 
      $('.action_button_label').hide(); //ADD THIS 
      $(this).html('<span class="action_button_label" style="color:gray;">Saving...</span>'); 
      $(this).parents('form').submit(); 
    } 
}); 

$('form').bind('submit', function() { 
    $(this).find('action_button').attr('onclick', ''); 
});

来源

2013-09-25 14:55:44 BenM

BenM，在服务器端检查的好建议。我也必须考虑这个解决方案。 –

提交表单，但只允许一次

回答

相关问题