Question

所以我正在加载一个带有基本脚本和基本表单的html页面。但是当页面加载时，用户可以选择两个单选按钮，YES或NO。如果您没有选择任何一个，我想提供一个警告框。我成功显示警告框，但当用户单击警报框中的“正常”按钮时，用户将被重定向到其他页面。我添加了声明， return false; 希望不会发生这种情况。

代码如下，

<!-- Javascript radiobutton form validation -->

<script type="text/javascript">

function valForm(form) {

    if(!document.getElementById('splash_false').checked && !document.getElementById('splash_true').checked  ) {
        alert('You either like splash pages or dislike em, choose one ...please');
        return false;
    }
}

</script>

<!-- Javascript radiobutton form validation END -->


</head>

<body>
<img src="pics/DSCN1566-300x225.jpg" alt="" width="640" height="auto"  />
<h1>Hello Javascript redirection.</h1><br />

<p>
<form name="tosplashornottosplash" action="splash-process.php" method="post">
Splash pages are stupid.

<input type="radio" name="splash" id="splash_false" value="false" /> No
<input type="radio" name="splash" id="splash_true" value="true" /> Yes

<input type="submit" name="splashSubmit" onClick="return valForm(tosplashornottosplash)" value="Enter" />
</form>
</p>

Answer 1

您应该将处理程序放在表单的onsubmit回调

中

<form onsubmit="return valForm(this)" action="splash-process.php" method="post">

将false返回给onsubmit处理程序将阻止您的表单被发布

Answer 2

尝试将其设置为表单上的onsubmit-callback，而不是按钮上的onclick-callback。这样，返回false将停止发布表单。

旁注：

由于您似乎没有在回调中使用对表单的引用，因此无需将其传递给回调函数。所以你可以这样称呼它，从表单上的onsubmit属性：

onsubmit="return valForm()"

摆脱回调签名中的form变量：

function valForm() {
   ...
}

Answer 3

您需要绑定到form的{{1}}事件：

onsubmit

（请注意，<form onsubmit="return valForm()">函数中的form参数从未实际使用过，也未正确填充。valForm指的是不存在的return valForm(tosplashornottosplash) JavaScript变量，因此评估为tosplashornottosplash。）

但是，建议您在JavaScript代码本身中绑定事件处理程序，而不是在HTML标记中连接它们：

undefined

这假设您提供了document.getElementById("myform").addEventListener("submit", valForm, false); ID form，并且在 myform元素加载到DOM后，此代码已执行。您可以通过将JavaScript放在页面底部（在关闭form之前）或绑定到body的{{1}}事件来确保这一点。

为了支持旧的IE浏览器，当DOMContentLoaded不可用时，您需要使用document。 The article on addEventListener at MDN建议类似：

attachEvent

或者，您可以抛出jQuery来促进DOM选择（例如addEventListener），并为您处理跨浏览器兼容性问题（例如if (form.addEventListener) { form.addEventListener("submit", valForm, false); } else if (form.attachEvent) { form.attachEvent("onsubmit", valForm); }）。

Javascript返回虚假行为是什么交易？

3 个答案: