Question

我有一个带有2个单选按钮选项的简单HTML表单，我想为所选的每个单选按钮调用不同的网页

我一直在尝试使用javascript，但我是javascript的新手，有没有办法通过使用jquery来实现？

这是我的HTML：

<form action="" id="formoid" title="" method="post">
 <div><input type="radio" name="op" id="op" value="student"><span>student</span>
 <input type="radio" name="op" id="op" value="company"><span>company</span>  
 </div>
 </div>
 <div><input type="submit" name="submit" id="submit" value="Submit"></div>
</form>

谢谢！

Answer 1

我不确定我是否说得对，但如果你的意思是改变表格的aciton属性，那么请使用以下内容：

<form action="" id="formoid" title="" method="post">
    <div><input type="radio" name="op" id="op" value="student" data-action="http://foo-bar.baz/form.php"><span>student</span>
    <input type="radio" name="op" id="op" value="company" data-action="http://foo-bar2.baz/form.asp"><span>company</span>                        </div>
    </div>
    <div><input type="submit" name="submit" id="submit" value="Submit"></div>
</form>

然后添加javascript代码（加载jQuery）：

<script type="text/javascript">
    $('#formoid radio[name="op"]').click( function() {
        $('#formoid').attr('action', $(this).attr('data-action') );
    } );
</script>

顺便说一句。你有无效的html结构，最好修复它：）

Answer 2

$("#submit").click(function(){
var val = $("input[type='radio']:checked").val();

if(val == "student"){
//post to 1 page
}

if(val == "company"){
//post to 1 page
}

Answer 3

javascript

<form action="#a" name="f1" title="" method="post" onSubmit=doSubmit()>
    <div><input type="radio" name="op" id="op" value="student"><span>student</span>
    <input type="radio" name="op" id="op" value="company">    <span>company</span>                        </div>
    </div>
    <div><input type="submit" name="submit" id="submit" value="Submit"></div>

    </form>

    <script>

function getRadioButtonValue(rbutton)
      {
        for (var i = 0; i < rbutton.length; ++i)
        {
          if (rbutton[i].checked)
            return rbutton[i].value;
        }
        return null;
      }


    function doSubmit(){
        val = getRadioButtonValue( document.f1.op)  

        if(val == "student"){
                document.f1.action = "student.html"
            }else{
            document.f1.action = "company.html"
        }
        document.f1.submit()
    }

    </script>

选择单选按钮选项后如何提交简单表单

3 个答案: