Summernote 显示在所有位置（Laravel 5.2）

Question

我正在使用 laravel 5.2。当我点击“编辑组名”时，summernote 文本编辑器显示在每个组名下方，如下所示：

我希望 Summernote 文本编辑器仅针对特定组名显示。

我的看法：

    @foreach($groups as $group)

   <div  id="zx" class="panel-content">
   <div class="row">
   <section  class=" col-md-offset-1 col-md-2 col-xs-offset-1 col-xs-3">
   <img id="imagecircle" style="width:40px;height:40px; 
   margin-top:5px;background-color:silver;" 
   class="img-circle" src="images/g.jpg"/>
   </section>
   <section class="col-md-offset-1 col-md-6 col-xs-8">
   <a id="hash" href="" style="font-size:20px;
   text-decoration:none;">{{$group->name}}</a>
   <textarea  style="display:none;" name="textfield4" 
   id="textfield4">  </textarea>
   <div class="groupname" id="a"></div>
   </section>


    <section class="col-md-1 dropdown">
    <button type="button" style="margin-top:5px;"
    class="btn btn-warning dropdown-toggle" data-toggle="dropdown">
    <span id="removesign" class="glyphicon glyphicon-chevron-down">
    </span></button>

    <ul class="dropdown-menu" role="menu">
    <li role="presentation"><a style="font-weight:bold; 
     color:black;" onclick="edit()" role="menuitem" tabindex="-1">
     Edit Group Name</a></li>
    <li role="presentation"><a style="font-weight:bold; 
    color:black;"role="menuitem" tabindex="-1"
     href="{{   URL('/groups/'.$group->id) }}">
      Leave This Group</a></li>

          </ul>
          </section>
           </div>
          </div>
       @endforeach

我的js代码：

    var edit = function() {
    $('.groupname').summernote({focus: true});
    };

Answer 1

你可以给元素summernote添加一个id

<div class="groupname" id="groupname_{{$group->id}}"></div>

并将 id 作为参数发送给函数 onclick 事件

<li role="presentation"><a style="font-weight:bold;
 color:black;" onclick="edit({{$group->id}})" role="menuitem" tabindex="-1">

并且只用选定的 id 初始化笔记

var edit = function(id) {
    $('#groupname_' + id).summernote({focus: true});
};