TinyMce编辑器不允许使用HTML标签

时间:2018-07-25 15:47:40

标签: html tinymce editor

我正在使用TinyMce编辑器,并尝试复制粘贴一些html标签并存储在数据库中, 但是问题是,它正在自动删除引导手风琴代码

<script>
tinymce.init({
forced_root_blocks: false,
selector: "textarea#cmshtml",
relative_urls: false,
convert_urls: false,
forced_root_block : false,
force_p_newlines : false,
width : "320",
height : "290",
remove_script_host: false,
document_base_url: base_url,
plugins: [
    "advlist autolink lists link image charmap print preview anchor",
    "searchreplace visualblocks code fullscreen",
    "insertdatetime media table contextmenu paste"
],
valid_elements : '*[*]',    
toolbar: "anchor | insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link "
        });
</script>

原始数据-

<div class="panel-group" id="accordion">
<div class="panel panel-default">
    <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">
        <div class="panel-heading">
            <div class="panel-title">
            <span class="glyphicon glyphicon-minus iconclr"></span>
            What is Lorem Ipsum?                
            </div>
        </div>
    </a>
  <div id="collapse1" class="panel-collapse collapse in">
    <div class="panel-body">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
  </div>
</div>
<div class="panel panel-default">
    <a data-toggle="collapse" data-parent="#accordion" href="#collapse2" >
      <div class="panel-heading">
        <div class="panel-title">
          <span class="glyphicon glyphicon-plus iconclr"></span>
          Why do we use it?           
        </div>
      </div>
    </a>
  <div id="collapse2" class="panel-collapse collapse">
    <div class="panel-body">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
  </div>
</div>

当我尝试在编辑器中复制粘贴上面的代码并尝试保存时,会删除Accordian并在结果下方显示

输出数据-

<div class="panel-group" id="accordion">
<div class="panel panel-default">
    <div class="panel-heading">
        <div class="panel-title">
        <span class="glyphicon glyphicon-minus iconclr"></span>
        What is Lorem Ipsum?                
        </div>
    </div>
  <div id="collapse1" class="panel-collapse collapse in">
    <div class="panel-body">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
  </div>
</div>
<div class="panel panel-default">
  <div class="panel-heading">
    <div class="panel-title">
      <span class="glyphicon glyphicon-plus iconclr"></span>
      Why do we use it?           
    </div>
  </div>
  <div id="collapse2" class="panel-collapse collapse">
    <div class="panel-body">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
  </div>
</div>

谁能给我一些建议吗?

1 个答案:

答案 0 :(得分:0)

尝试对enter image description here中的valid_elements使用完整的XHTML规则集。我使用默认规则集,但删除了所有添加到的属性。请参见tinyMce Docs