复选框选择时的表单重定向
Form redirect on checkbox selection
这是我想要实现的:我想创建一个HTML页面的表单,当你提交的表单去4个位置之一。有一个默认的隐藏主选项是在页面加载时自动选择的,还有两个可选的子选项。
哦,它会计算选择的金额!
下面是目前为止的代码:<html>
<head></head>
<body>
<form onSubmit="submitForm();" id="myForm" type="get">
<input id="myCheckbox1" name="myCheckbox1" type="checkbox" value="20" onClick="calcNow();" />Default option<br/>
<input id="myCheckbox2" name="myCheckbox2" type="checkbox" value="30" onClick="calcNow();" />Add-on option 1<br/>
<input id="myCheckbox2" name="myCheckbox2" type="checkbox" value="40" onClick="calcNow();" />Add-on option 2<br/>
<input id="myTotal" name="myTotal" type="text" value="" disabled="disabled" /><br/>
<input type="button" id="myButton" onClick="submitForm();" value="Continue" />
</form>
<script type="text/javascript">
var pages = [[["http://mysite.com/page1.html"],["http://mysite.com/page2.html"],["http://mysite.com/page3.html","http://mysite.com/page4.html"]]];
function calcNow()
{
var cb = document.getElementById("myCheckbox1");
var cb = document.getElementById("myCheckbox2");
var cost1 = cb.checked ? parseInt(cb.value) : 0;
var cost2 = cb.checked ? parseInt(cb.value) : 0;
var costTotal = cost1 + cost2;
document.getElementById("myTotal").value = costTotal;
var op1 = cb.checked ? 1 : 0;
if (op1 != undefined)
{
return pages[op1];
}
return undefined;
}
function submitForm()
{
var page = calcNow();
if (page != undefined)
{
alert(page);
// ---- To navigate ----
//location.href = page;
// ---- To alter post ----
//var form = document.getElementById("myForm");
//form.action = page;
//form.submit();
}
else
{
alert("Please answer all questions.");
}
}
function getRadioValue(name)
{
var controls = document.getElementsByName(name);
for (var i = 0; i < controls.length; i++) {
if (controls[i].checked) {
return parseInt(controls[i].value);
}
}
return 0;
}
function getRadioData(name, attribute)
{
var controls = document.getElementsByName(name);
for (var i = 0; i < controls.length; i++) {
if (controls[i].checked) {
return parseInt(controls[i].dataset[attribute]);
}
}
return undefined;
}
</script>
</body>
</html>
试试这个
编辑:function submitForm()
{
//The code goes inside here, you have to decide where to redirect from if or the else
window.location.assign("http://www.w3schools.com/");
var page = calcNow();
if (page != undefined)
{
alert(page);
}
else
{
alert("Please answer all questions.");
}
}
相关文章:
- 根据select选项元素将表单重定向到不同的URL
- HTML表单重定向
- 根据选择选项元素将表单重定向到不同的URL,并在电子邮件中获取表单详细信息
- 如何根据选择下拉列表从表单重定向到 URL
- 根据select option元素将表单重定向到不同的URL,但重定向后未选中
- 验证表单+重定向
- 提交的表单重定向到输入URL
- 花式框默认关闭在表单重定向后不起作用
- 如何将选择加入表单重定向到感谢页面
- 基于表单数据提交表单重定向
- 护照 JS - 一个登录表单 - 重定向到不同的 URI,具体取决于用户角色
- 表单重定向成功/失败页面
- 如何将表单数据从eloqua中的表单重定向到登录页
- 有人能总结一下这个cookie/表单重定向的作用吗
- Javascript不会将表单重定向到指定的文件路径(或URL),使用按回车键或单击提交按钮的双重选项
- 表单重定向提交不工作,为什么
- 复选框选择时的表单重定向
- 如何使用javascript从html登录表单重定向到欢迎页面?该网站处于脱机状态,并且位于开发服务器上
- onsubmit:当表单重定向时不提交数据
- 将网站URL表单重定向到特定页面