多个JQuery不同的表单选择器

我有两个表单one和two，根据提交的表单，我想在逻辑结束时根据提交的值调用一个函数。

我想知道我是否可以检索每个选择器作为数组索引，循环或属性或var = tagsOrAnswerers的东西?然后我可以把这个参数传递给我的函数它会被调用。

<html>
     <form class="one">
         <input type="text" name="foo">
         <input type="submit" value="Submit">
     </form>
     <form class="two">
         <input type="text"name="boo">
         <input type="submit" value="Submit">
     </form>
</html>
<script>
       $('.one,.two').submit( function(){
       var fooOrBoo = $(this).find("input[name='foo'],[name='boo']").val();
       getBoo(ifBoo); //run this function if var fooOrBoo = 'boo';
       getFoo(ifFoo); //run this function if var fooOrBoo = 'foo';
});
</script>

给每个表格的答案一个通用的名称。我把它命名为"answer"

   <div class="forms">
             <form class="one">
                 <input type="text" name="answer">
                 <input type="submit" value="Submit">
             </form>
             <form class="two">
                 <input type="text"name="answer">
                 <input type="submit" value="Submit">
             </form>
</div>

脚本如下:

<script>
$('.forms > form').submit( function(){
   var data = $( this ).serializeArray();
   console.log(data); // gives the current data of the forms
  //using the data you can call whatever function you want using a switch statment
});
</script>

如果你想要一个单一的事件方法，可以试试这个，但这真的取决于你的函数要做什么

 $('.forms > form').submit( function(e){
   e.preventDefault();
   var formN = $('form').index(this);
   switch(formN){
     case 0:
         alert("FUNCTION1");
       break;
     case 1:
         alert("FUNCTION2");
       break;
     //and so on.....
   }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="forms">
     <form class="one">
         <input type="text" name="foo">
         <input type="submit" value="Submit">
     </form>
     <form class="two">
         <input type="text"name="boo">
         <input type="submit" value="Submit">
     </form>
</div>

相关内容

最新更新

热门标签：