如何在页面中分隔两个表单

时间:2014-04-06 20:34:01

标签: javascript html forms

我在页面中有两个表单但是当我点击一个按钮时,另一个表单也会运行>>>同一页面的两个窗口<<<会打开的。如何在页面中分离这两个或多个表单的功能?

代码如下。另一个表单具有相同的代码和不同的Web地址。

<form method="post">
             <input id="element 1_1" class="element radio1" name="element 1" type="radio" value="http://www.yahoo.com" /> 
    MODEL 13<br/>
    <br/>
    <input id="element 2_1" class="element radio1" name="element 1" type="radio" value="http://www.msn.com" />
    MODEL 17<br/><br/>
    <input id="element 3_1" class="element radio1" name="element 1" type="radio"   value="http://www.ebay.com" /> 
    MODEL 22 <br/><br/>

<script>
$(function () {
    $("form").submit(function (e) {
        e.preventDefault();
        var url = $(this).find('input[type="radio"]:checked').val();
        window.open(url);

    });
});
</script></form>

其他编码员

<form method="post">
              <input id="element 1_2" class="element radio" name="element 2" type="radio" value="http://www.123.com" /> 
    MODEL 5 - 8<br/>
    <br/>
    <input id="element 2_2" class="element radio" name="element 2" type="radio" value="http://www.543.com" />
    MODEL 6-10<br/>
    <br/>
<script>
$(function () {
    $("form").submit(function (e) {
        e.preventDefault();
        var url = $(this).find('input[type="radio"]:checked').val();
        window.open(url);

    });
});
</script></form>

1 个答案:

答案 0 :(得分:1)

您可以对每个表单使用属性id

<form method="post" id="form1">
   ...
</form>

<form method="post" id="form2">
   ...
</form>

<script>
$(function () {
  $("#form1").submit(function(e) {
    // function for form1
  });
  $("#form2").submit(function(e) {
    // function for form2
  });
});
</script>