“onclick”似乎没有使用“提交”按钮调用函数答案

【问题标题】：'onclick' doesn't seem to call a function with 'submit' button“onclick”似乎没有使用“提交”按钮调用函数
【发布时间】：2011-09-19 05:23:34
【问题描述】：

我遇到过很多次（我不想在这里使用“输入类型按钮”）为什么哦为什么“onclick”不调用函数 check(); ?即使字段为空，页面仍会提交。谢谢你们的cmets。

Javascript：

function check() { 
    var name =  document.getElementById('username_res');
    var passw_old =  document.getElementById('passw_reset_old');
    var passw_new =  document.getElementById('passw_reset');
    var button_res = document.getElementById('sub_res');

    if ((name.val() == "") && (passw_old.val().length == "") && (passw_new.val().length == "")) { 
        button_res.disabled = true; 
    } else {
        button_res.disabled = false;
    }
}

HTML：

<form id="passw_res" name="passw_res" method="post" action="pass_reset.php">
<fieldset style="width:300px"><br/>
<legend id="pass_legend" align="left">Password reset</legend><br/>
<input type="text" id="username_res" name="username_res" maxlength="50" />
<input type="password" id="passw_reset_old" name="passw_reset_old" maxlength="16"/>
  <input type="password" id="passw_reset" name="passw_reset" maxlength="16"  />
  <input type="submit" value="submit" id="sub_res" name="sub_res" onclick="check();"/>
 </fieldset>
  </form>

所以...页面不应该在空字段上提交 - 为什么要提交？谢谢..

【问题讨论】：

有什么原因不能使用onsubmit 事件？
使用onsubmit。并在你的函数中return false; 以防止在必要时提交。

标签： php javascript html

【解决方案1】：

把你的函数改成这样：

function check() { 

    var name =  document.getElementById('username_res').value;
    var passw_old =  document.getElementById('passw_reset_old').value;
    var passw_new =  document.getElementById('passw_reset').value;

    return ((name != '') && (passw_old != '') &&  (passw_new != ''));

}

您实际上不必将 onclick 事件更改为 onsubmit，只需将其更改为 onclick="return check();"。您需要对 onclick 事件返回 false 以防止它被触发。

您可能希望添加一些视觉增强功能来说明未提交表单的原因。否则会让访问者感到困惑。

【讨论】：

本来要编辑的，但万一我错过了什么。您的 var 是对象，但您将它们与字符串进行比较。
谢谢！是的......现在似乎可以工作 - onclick='return check();'是正确的...我还将值更改为 (name.value == "" ) || (....) 而不是 (name.val() == "")..

【解决方案2】：

你正试图在一个标准的 javascript 变量上调用一个 jquery 方法。

试试这个

if ((name.value == "") && (passw_old.value == "") && (passw_new.value == "")) {
    return false;  
} else { 
    return true; 
}

你提交按钮应该是

<input type="submit" value="submit" id="sub_res" name="sub_res" onclick="return check();"/>

【讨论】：

【解决方案3】：

您需要将按钮的类型从 type="submit" 更改为 type="button"，然后在 check() 函数中，如果一切通过，您需要获取表单对象并提交。

类似 document.getElementById('formID').submit()

【讨论】：

是的，非常适合未启用 javascript 的访问者：他们将无法发布表单。
对不起，但我个人认为不使用 javascript 有点糟糕......现在你怎么能不使用 javascript 呢？我可以理解有人不想使用 Flash（仍然想知道为什么'因为 Flash 还是可以的）但是 JS 呢？来吧...Facebook 也建立在它之上；]

【解决方案4】：

您需要返回false 以避免事件传播。

点赞here。

【讨论】：

【解决方案5】：

您可以尝试使用表单的 onSubmit 函数

<form id="passw_res" action="pass_reset.php" onSubmit="check()">

【讨论】：

【解决方案6】：

页面提交是因为您的 check() 脚本中没有任何内容可以阻止它。您的脚本仅在验证时禁用按钮，但此时点击/提交已经发生，因此表单将提交。

所以请使用onsubmit='return check();'，而不是禁用，而是根据您的验证返回真或假。如果 check() 返回 false，这将“停止”提交操作，如果返回 true，则继续提交。

【讨论】：