Question

<script>
function disableButton() {
    var button = document.getElementById('accept');
    button.disabled = true; 
    return true;
}
</script>

<form class="form-horizontal" name ="reg" method="post" action="" onSubmit="return disableButton()"/>

<button class="btn btn-info" name="sub" type="submit" id="accept">
    <i class="icon-ok bigger-150"></i>
    Submit
</button

当我点击提交按钮时，按钮被禁用但表格未提交

请任何人帮忙

Answer 1

您可以简单地捕捉表单提交，禁用按钮并允许其继续播放，而不是尝试向表单添加功能：

HTML部分：

<form class="form-horizontal" id="reg" name="reg" method="post" action="" />

Javascript Part：

<script type="text/javascript">
var form = document.getElementById('reg');

if (form.attachEvent) {
    form.attachEvent("submit", processForm);
} else {
    form.addEventListener("submit", processForm);
}

function processForm(e) {
    if (e.preventDefault) e.preventDefault();

    var button = document.getElementById('accept');
    button.disabled = true;

    return true;
}
</script>

如果您想测试一下，请将上方更改为return false;。这将禁用表单提交，仅禁用该按钮。

Answer 2

您的功能没有遵循正确的语法。但除此之外，没有真正的理由回归真假......

var acceptor = document.getElementById("accept");
acceptor.addEventListener("click", toggleButton);

function toggleButton() {
  acceptor.disabled = "disabled"
}

<button class="btn btn-info" name="sub" type="submit" id="accept">
  <i class="icon-ok bigger-150"></i>
  Submit
</button>

此外，您的按钮标记未关闭<button> </button> ...

您可以简单地定义属性定义为布尔值true或false，这意味着您可以指定其值并将其他所有内容保留。即取代禁用=“禁用”。

您可能需要考虑一个功能buttonToggler ...以便稍后可以轻松切换回来（虽然我不确定这会对您有所帮助......

另外......在预加载问题的情况下将脚本放在正文的底部而不是顶部（对于JS加载速度比HTML快的问题，这不是一个万无一失的解决方案。）

<script type="text/javascript">
function toggleButton() {
var acceptor = document.getElementById('accept');
if acceptor.disabled === true{
acceptor.disabled=false;
} else {
acceptor.setAttribute('disabled', 'disabled');
} 
</script>

试试。

Answer 3

尝试以下方法：

<?php echo "<pre>";var_dump($_POST); echo "</pre>";?>
<script>
    function disableSubmit() {
        var button = document.getElementById('accept');
        button.disabled = true; 
        myNiceForm.submit();
    }
</script>

<form class="form-horizontal" id="myNiceForm" name ="reg" method="post" action="<?php echo $_SERVER['PHP_SELF'];?>">
    <input type="text" name="myTestText"/>
    <input id="accept" type="submit" onclick="disableButton()"/>
</form>

需要考虑的事项：

如果您希望发布HTML表单，则需要正确使用 action属性的值。
ID为accept的按钮不会导致该表单发布，你也没有任何客户端脚本这样做，而且它是这不是一个好习惯，因此表单中添加了一个提交按钮。
单击提交按钮时，disableSubmit()功能调用并禁用按钮，最后提交表单但是，编程方面没有必要。

form buttom disable onsubmit但是javasc

3 个答案: