表单嵌套问题的解决方法

Posted 2020-12-29 jpfss

在html中，表单form是不能够嵌套使用的，例如：

<form name="form1">
    <form name="form2">
    ......
    </form>
    .....
</form>

这样是不合法的，那么如果我们遇到需要用到两个表单的情况应该怎么办呢？解决的方法很简单，合并两个表单，动态改变表单提交位置。

表单form中的action为空，然后在js代码中改变action的值。

<form name="form1" action="" method="post">
   .....
   <button id="button1" type="submit"></button>
   <button id="button2" type="submit"></button>
</form>
<script>
      $(document).ready(function(){
           $("#button1").click(function(){
               
                $("#draw").attr("action","url1"); 
               $("form").submit();
            });
         $("#button2").click(function(){
              
                $("#draw").attr("action","url2"); 
               $("form").submit();
            });
</script>

这样，就能实现一个表单向不同方法提交了，同时，在表单提交之前还可以改变表单元素的值，方法就是

$("#draw").attr("action","url1"); 

注意，button的类型是submit  不是button