基于表单域的不同页面

Question

我有一个表单，我希望根据基于状态表单域选择的内容重定向到不同的页面。

<form action="capture.php" method="post"> 

    <input type="text" name="_FirstName" required/> 
    <input type="text" name="_LastName" required/> 
    <input type="tel" id="phone" name="_Phone" required/> 
    <input type="email" name="Email" required/> 

    <select name="_State" id="state" required> 
    <option value="AL">Alabama</option> 
    <option value="AK">Alaska</option> 
    <option value="AZ">Arizona</option> 
    <option value="AR">Arkansas</option> 
    <option value="CA">California</option> 
    <option value="CO">Colorado</option> 
    <option value="CT">Connecticut</option> 
    <option value="DE">Delaware</option> 
    <option value="DC">District of Columbia</option> 
    <option value="FL">Florida</option> 
    </select> 

    <input id="submit" type="submit"> 

</form> 

这是我使用的基于关键字this的JavaScript代码。问题是我不断直接进入'capture.php'页面，不管我选择什么状态选项。

<script type="text/javascript"> 
function submit { 
    if(document.getElementById('state').value == 'AZ' || 
    document.getElementById('state').value == 'AR' || 
    document.getElementById('state').value == 'CA') || 
    document.getElementById('state').value == 'CO') || 
    document.getElementById('state').value == 'CT') 
{ 
window.location.href == "warranty.php"; 
} 
else 
{ 
window.location.href == "capture.php"; 
} 
</script> 

任何想法？谢谢！

编辑：JavaScript代码是否应该在html页面的标题中？

Answer 1

而不是设置window.location.href而是尝试设置表单的操作属性。

document.getElementById("myForm").action = "form_action.asp"; 

• http://www.w3schools.com/jsref/prop_form_action.asp

Answer 2

您的submit()功能的一些语法错误：

• 你缺少()您的功能。
• 有一些额外的括号'CO')或'CA')。
• 使用单一=为window.location的

标志修改功能：

<script type="text/javascript"> 
function submit() { 
    if(document.getElementById('state').value == 'AZ' 
    || document.getElementById('state').value == 'AR' 
    || document.getElementById('state').value == 'CA' 
    || document.getElementById('state').value == 'CO' 
    || document.getElementById('state').value == 'CT') 
    { 
    window.location.href = "warranty.php"; 
    } 
    else 
    { 
    window.location.href = "capture.php"; 
    } 
} 
</script> 

侧面说明：

您还可以使用window.open像：

window.open('capture.php'); 

Answer 3

你有几个错误在你的代码e.g：==用于comparaison而不是赋值

1. 两个等号。

2. select标签是不是自闭标记，以便您在前人的精力到底删除/：在你的病情

   <select name="_State" id="state" required/> 
   _________________________________________^ 
   

3. 一些额外的parenthese (。

4. 函数声明中缺少括号。

然后我看不到你在哪里打电话submit()。

---

上submit事件IMO增加会更好，点击提交按钮改变动作，然后提交表单编程后：

$('form').on('submit', function(e){ 

    if(document.getElementById('state').value == 'AZ' || 
     document.getElementById('state').value == 'AR' || 
     document.getElementById('state').value == 'CA' || 
     document.getElementById('state').value == 'CO' || 
     document.getElementById('state').value == 'CT') 
    { 
     $('form').prop('action', "warranty.php"); 
    } 
    else 
    { 
    $('form').prop('action', "capture.php"); 
    } 

    return true; 
}); 

希望这有助于。

Answer 4

问题是没有任何关联您的表单提交到您的JavaScript函数。因此，当您验证表单时，它会直接转到“action”属性中提供的地址。

简单的解决方案

改变你的按钮，这个的标记，因此点击将链接到函数调用：

<input id="submit" type="submit" onclick="submit()"> 

使用jQuery：

负荷的jQuery与您的网页，并添加一个id到你的形式是这样的：

<form id="myform" action="capture.php" method="post"> 

文档中添加以下代码：

$(document).ready(function() { 
    $('#myform').submit(function(e) { 
     e.preventDefault(); // this prevent the form from going to capture.php 
     submit(); 
     return false; 
    }); 
});