我写了这段代码,点击后禁用我网站上的提交按钮:
$('input[type=submit]').click(function(){
$(this).attr('disabled', 'disabled');
});
Run Code Online (Sandbox Code Playgroud)
不幸的是,它没有发送表格.我怎样才能解决这个问题?
编辑 我想绑定提交,而不是形式:)
我在表单的末尾有一个提交按钮.
我在提交按钮中添加了以下条件:
onClick="this.disabled=true;
this.value='Sending…';
this.form.submit();"
Run Code Online (Sandbox Code Playgroud)
但是当它移动到下一页时,参数没有通过,并且传递了空值.
我一直试图找到"正确"的方法来防止双重提交表格.SO上有很多相关的帖子,但没有一个在我这里找到.下面两个问题.
这是我的表格
<form method="POST">
<input type="text" name="q"/>
<button class="once-only">Send</button>
</form>
Run Code Online (Sandbox Code Playgroud)
这是我第一次尝试禁用双提交:
$(document).ready(function(){
$(".once-only").click(function(){
this.disabled = true;
return true;
});
});
Run Code Online (Sandbox Code Playgroud)
这是这里建议的方法:使用JS/Jquery发布后禁用按钮.该帖子表明提交元素必须是输入而不是按钮,但测试两者没有区别.您可以使用这个小提琴自己尝试:http://jsfiddle.net/uT3hP/
如您所见,这会禁用该按钮,但也会阻止提交表单.在提交元素是按钮和输入元素的情况下.
问题1:为什么此单击处理程序停止提交表单?
搜索更多我找到这个解决方案(当我禁用提交按钮以防止双击时,为什么我的表单不发布?)
if($.data(this, 'clicked')){
return false;
} else{
$.data(this, 'clicked', true);
return true;
}
Run Code Online (Sandbox Code Playgroud)
你可以用这个小提琴来玩这个:http://jsfiddle.net/uT3hP/1/
这确实有效,但......
问题2: 这是我们能做的最好的吗?
我认为这将是一件基本的事情.方法1不起作用,方法2不起作用,但我不喜欢它并且感觉必须有一种更简单的方法.
首先,我想验证输入的一些字段值.之后当我单击提交按钮时,必须在单击后禁用该按钮以避免重复提交.怎么用javascript做到这一点?
<script type="text/javascript" language="javascript">
function ValidateIt() {
if (document.getElementById('ddlProblemCategory').value == 0) {
alert("Please fill some value");
return false;
}
return true;
}
function DisableIt() {
if (ValidateIt() == true)
document.getElementById('btnSaveProblem').disabled = true;
}
</script>
Run Code Online (Sandbox Code Playgroud)