javascript - ラジオボタンオプションを選択した後に簡単なフォームを送信する方法

Question

2 つのラジオ ボタン オプションを持つ単純な HTML フォームがあり、選択したラジオ ボタンごとに異なる Web ページを呼び出したい

私は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

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>

Answer 3

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

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

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