jQuery的点击通过类工作不

Question

，我有以下的HTML代码中引导：

<div class="panel panel-default text-center"> 
 
         <div class="panel-heading"> 
 
          <h3>Team Meta Data</h3> 
 
         </div><!--panel heading end--> 
 
         <hr> 
 
         <form class="form-horizontal" id="team-meta-form"> 
 
          <input type="hidden" id="option" name="option" value="12"> 
 
          <input type="hidden" id="tab-type" name="tab-type" value="team"> 
 
          <div class="form-group"> 
 
           <label for="team-meta-page-title" class="col-sm-3 control-label">Meta Page Title:</label> 
 
           <div class="col-sm-6"> 
 
            <input type="text" class="form-control" id="team-meta-page-title" name="meta-page-title"> 
 
           </div> 
 
           <span class="col-xs-3">(Enter Page Title)</span> 
 
          </div> 
 
          <div class="form-group"> 
 
           <label for="team-meta-page-description" class="col-sm-3 control-label">Meta Page Description:</label> 
 
           <div class="col-sm-6"> 
 
            <input type="text" class="form-control" id="team-meta-page-description" name="meta-page-description"> 
 
           </div> 
 
           <span class="col-xs-3"> (Enter Meta Page Description)</span> 
 
          </div> 
 
          <div class="form-group"> 
 
           <label for="team-meta-keywords" class="col-sm-3 control-label">Meta Keywords:</label> 
 
           <div class="col-sm-6"> 
 
            <input type="text" class="form-control" id="team-meta-keywords" name="meta-keywords"> 
 
           </div> 
 
           <span class="col-xs-3">(Enter Meta Keywords)</span> 
 
          </div> 
 
         </form> 
 
         <div class="panel-footer"> 
 
          <button class="btn btn-lg" id="team-meta-submit" class="add_meta_submit">Save Changes</button> 
 
          <br><div id="teammetamsg" name="teammetamsg"></div> 
 
         </div><!--panel footer end--> 
 
        </div><!--panel end-->

的按钮具有类 “add_meta_submit”。一个主div内有大约6个类似的bootstrap窗格。每个窗格也有其自己的形式。我创建了一个超级简单的点击处理程序如下。

$('.add_meta_submit').click(function(){ 
 
     alert("click worked"); 
 
    });

这是完全行不通的。如果我通过ID访问点击事件是这样的：。

$（“＃荟萃提交”）点击（函数（）{

它屡试不爽类事件，我不能去上班我有6种形式的数据非常相似，我想简单地捕获所有表单并将它们发送到相同的后端函数。基本上我想从类的启动函数中单击然后根据元素的id单击序列化表单其发送到后端。

Answer 1

你有类=“”两次，那是错误，在这里你去

$(".add_meta_submit").click(function(){ 
 
     alert("click worked"); 
 
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter- bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 

 

 
<div class="panel panel-default text-center"> 
 
         <div class="panel-heading"> 
 
          <h3>Team Meta Data</h3> 
 
         </div><!--panel heading end--> 
 
         <hr> 
 
         <form class="form-horizontal" id="team-meta-form"> 
 
          <input type="hidden" id="option" name="option" value="12"> 
 
          <input type="hidden" id="tab-type" name="tab-type" value="team"> 
 
          <div class="form-group"> 
 
           <label for="team-meta-page-title" class="col-sm-3 control-label">Meta Page Title:</label> 
 
           <div class="col-sm-6"> 
 
            <input type="text" class="form-control" id="team-meta-page-title" name="meta-page-title"> 
 
           </div> 
 
           <span class="col-xs-3">(Enter Page Title)</span> 
 
          </div> 
 
          <div class="form-group"> 
 
           <label for="team-meta-page-description" class="col-sm-3 control-label">Meta Page Description:</label> 
 
           <div class="col-sm-6"> 
 
            <input type="text" class="form-control" id="team-meta-page-description" name="meta-page-description"> 
 
           </div> 
 
           <span class="col-xs-3"> (Enter Meta Page Description)</span> 
 
          </div> 
 
          <div class="form-group"> 
 
           <label for="team-meta-keywords" class="col-sm-3 control-label">Meta Keywords:</label> 
 
           <div class="col-sm-6"> 
 
            <input type="text" class="form-control" id="team-meta-keywords" name="meta-keywords"> 
 
           </div> 
 
           <span class="col-xs-3">(Enter Meta Keywords)</span> 
 
          </div> 
 
         </form> 
 
         <div class="panel-footer"> 
 
          <button class="btn btn-lg add_meta_submit" id="team-meta-submit" >Save Changes</button> 
 
          <br><div id="teammetamsg" name="teammetamsg"></div> 
 
         </div><!--panel footer end--> 
 
        </div><!--panel end-->

希望这个作品！

Answer 2

首先检查您是否已正确链接Jquery。检查脚本src。这很好，然后将课程更改为ID。如果你想使用类，然后把一个id放在父div上。

$('#parent_id .yourclass').click();