首页 > 解决方案 > onclick 具有相同的类

问题描述

我在这个 div 中有 Div1 和 Div2 我有多个输入。目标是当我单击 div 1 btn 编辑时,它会显示 div 1 内的输入,与 div2 相同

我的html

我的 1º 格

   <div class="col-lg-6 col-md-6 xxx">
       <div class="row form-group ">
           <div class="col-lg-6 col-md-6"><h6 >xxx Nº 1</h6></div> 
                 <div id="edit" class="btn btn-sm"> Edit </div> 
            </div>
            <div class="form-group  edit_xxx" id="edit_xxx">
                <div class="row form-group" >
                        <div class="col-lg-5 col-md-5 row">
                            <div id="minus" class="btn btn-sm-click btn-info fa fa-minus pull-left"></div>

                                <input id="xxx" name="xxx" class="form-control click select-form" disabled type="text" value="{{ $i }}" >

                            <div id="plus" class="btn btn-sm-click btn-info fa fa-plus pull-right"></div>
                        </div>

                    </div>

                     </div>
                        </div>

我的 2º 格

                        <div class="row form-group " >
                              <div class="col-lg-6 col-md-6"><h6 >xxx Nº 2</h6></div> 
                            <div id="edit" class="btn btn-sm"> Edit </div> 
                        </div>
                        <div class="form-group  edit_xxx" id="edit_xxx">

                    <div class="row form-group" >

                        <div class="col-lg-5 col-md-5 row">
                            <div id="minus" class="btn btn-sm-click btn-info fa fa-minus pull-left"></div>

                                <input id="xxx" name="xxx" class="form-control click select-form" disabled type="text" value="{{ $i }}" >

                            <div id="plus" class="btn btn-sm-click btn-info fa fa-plus pull-right"></div>
                        </div>

                    </div>
                       </div>
                        </div>

我的jQuery代码:

    $("body").on("click", ".xxx",function(){ 
      $(this).parent().find(".edit_xxx").toggle();
   });

最终目标是当在 .xxx 内单击时,它会打开输入 id 单击再次关闭来自 DIV1 的输入,如果单击 div2,则相同

感谢您的帮助,我真的很喜欢 jquery。

标签: javascriptjquerydomtoggle

解决方案


答案!

$("body").on("click", "#edit",function(){
          $(this).parents(".xxx").children("#edit_xxx").toggle();
  });

推荐阅读