同一页面中加载两个相同的控件,结果只能出来一个,这是为什么

今天在做项目的时候,我要在同一个页面中加载两个文本编辑器,刚开始,我的两个文本编辑器的id都是一样的,结果我怎么改,它都是加载的一个,另一个始终出不来,后来我咨询了一个朋友后,他告诉我在一个页面中,要始终保持id是唯一的,这样才不会发生冲突。下面是简单的代码:

 1 这个直接在页面中加载 
 2 <div id="remarks"></div>
 3 
 4 这个是加载在模态框中的
 5 <div class=" modal fade" id="update_q" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 6         <div class="modal-dialog">
 7             <div class="modal-content">
 8                 <div class="modal-header">
 9                     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
10                     <h4 class="modal-title" id="myModalLabel"><b>问题描述</b></h4>
11                 </div>
12                 <div class="modal-body">
13                         <div>
14                             <label style="margin-top:10px;font-size:large;">标题:</label>
15                             <input type="text" style="margin-top:-40px; margin-left:50px;max-450px;" class="form-control input-lg" placeholder="请输入你要搜索的问题" />
16                         </div>
17                         <div>
18                             <label style="margin-top:10px;font-size:large;">描述:</label><hr />
19                             <div id="remarks1"></div>
20                         </div>
21                 </div>
22                 <div class="modal-footer">
23                     <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
24                     <button type="button" class="btn btn-primary">提交</button>
25                 </div>
26             </div>
27         </div>
28     </div>
29 
30 下面要引用一段js
31 <script type="text/javascript">
32     $(document).ready(function () {
33         var para = {
34             toolbar: [
35               ['style', ['bold', 'italic', 'underline', 'clear']],
36               ['font', ['strikethrough', 'superscript', 'subscript']],
37               ['fontsize', ['fontsize']],
38               ['color', ['color']],
39               ['para', ['ul', 'ol', 'paragraph']],
40               ['height', ['height']]
41             ],
42             lang: 'zh-CN'
43         };
44         $('#remarks').summernote(para);
45         $('#remarks1').summernote(para);
46     })
47 </script>

所以在这里专门写一篇博客提醒大家,不论什么页面,都要保证我们的id唯一。

原文地址:https://www.cnblogs.com/xing-cheng/p/6004879.html