冲突两个HTML表单

Question

我有一个两个表单相互冲突 我想更改表单id在“var form = $（'form'）;”如“var form = $（'myForm'）;” 请让我知道如果我改变ID形式myForm的，在下面的代码这种情况下，我怎么能合并：

$(document).ready(function(){ 
     var form = $('form'); 
     var submit = $('#submit'); 

     form.on('submit', function(e) { 
      // prevent default action 
      e.preventDefault(); 
      // send ajax request 
      $.ajax({ 
       url: 'ajax_comment.php', 
       type: 'POST', 
       cache: false, 
       data: form.serialize(), //form serizlize data 
       beforeSend: function(){ 
        // change submit button value text and disabled it 
        submit.val('Submitting...').attr('disabled', 'disabled'); 
       }, 
       success: function(data){ 
        // Append with fadeIn see http://stackoverflow.com/a/978731 
        var item = $(data).hide().fadeIn(800); 
        $('.comment-block').append(item); 

        // reset form and button 
        form.trigger('reset'); 
        submit.val('Submit Comment').removeAttr('disabled'); 
       }, 
       error: function(e){ 
        alert(e); 
       } 
      }); 
     }); 
    }); 

HTML代码：

<form class="form-horizontal" role="form" id="form" method="post"> 
        <!-- need to supply post id with hidden fild --> 
        <input type="hidden" name="filmId" value="<?php echo $row['filmId']?>"> 
        <div class="form-group">       
         <div class="col-sm-2"> 
          <label>Name *</label> 
         </div> 
         <div class="col-sm-10"> 
          <input class="form-control" type="text" name="name" id="comment-name" placeholder="Your Name" required> 
         </div> 
        </div> 
        <div class="form-group"> 
         <div class="col-sm-2"> 
          <label>Email *</label> 
         </div> 
         <div class="col-sm-10"> 
          <input class="form-control"type="email" name="mail" id="comment-mail" placeholder="Your Email" required> 
         </div> 
        </div> 
        <div class="form-group"> 
         <div class="col-sm-2"> 
          <label>Comment *</label>  
         </div> 
         <div class="col-sm-10"> 
          <textarea class="form-control" rows="5" name="comment" id="comment" placeholder="Type your comment here...." required></textarea> 
         </div> 
        </div> 
        <div class="form-group"> 
         <div class="col-sm-offset-2 col-sm-10"> 
          <input type="submit" class="btn btn-primary" id="submit" value="Submit Comment"> 
         </div> 
        </div> 
       </form> 

Answer 1

您必须使用ID选择的jQuery

$（ “＃formId”）

，而不是类 '形式' 大家使用。

您简化HTML：

<form id="form1">     
<input type="submit" id="submit1"/>      
</form> 

<form id="form2">     
<input type="submit" id="submit2"/>    
</form> 

简化JS：

var form1 = $('#form1'); 
var submit1 = $('#submit1'); 
form1.submit(function(e) { 
    alert('hey1'); 
    // prevent default action 
    e.preventDefault(); 
    // send ajax request 
}); 

var form2 = $('#form2'); 
var submit2 = $('#submit2'); 
form2.submit(function(e) { 
    alert('hey2'); 
    e.preventDefault(); 
}); 

的结果中的jsfiddle：http://jsfiddle.net/jzb2hn9j/

Answer 2

给每个形成像这样

一个id

<form id="firstForm" method="post"> 
    ..... form data 
</form> 

<form id="secondForm" method="post"> 
    ..... form data 
</form> 

，然后选择形式所以

var formOne = $("#firstForm"), 
    formTwo = $("#secondForm");