Question

我正在编写一个非常基本的WYSIWYG丰富编辑器，使用Polymer contenteditable的{{1}}属性，但遇到问题div并执行命令document.execCommand 。如果您选择并突出显示要插入无序列表的文本并单击按钮，则无法使用Chrome（最新版本）或使用Safari（最新版本High Sierra）无法正常工作，只需挂起即可。如果你在Polymer（普通的旧HTML和javascript）之外尝试它，它可以正常工作。有任何想法如何使用Polymer 2.0？这是我的代码：

insertunorderedlist

和index.html：

<link rel="import" href="../../bower_components/polymer/polymer-element.html">

<dom-module id="polymerbasic-app">
  <template>
    <style>
      :host {
        display: block;
      }
    </style>
    <button on-click="_insertunorderedlist" type="button">Insert Unordered List</button>

    <div id="textBox" contenteditable="true">
      Bullet One
      <br> Bullet Two
      <br> Bullet Three
    </div>
  </template>

  <script>
    /**
     * @customElement
     * @polymer
     */
    class PolymerbasicApp extends Polymer.Element {
      static get is() { return 'polymerbasic-app'; }
      static get properties() {
        return {
          prop1: {
            type: String,
            value: 'polymerbasic-app'
          }
        };
      }

      _insertunorderedlist() {
        document.execCommand("insertunorderedlist", false, null); this.$.textBox.focus();
      }
    }

    window.customElements.define(PolymerbasicApp.is, PolymerbasicApp);
  </script>
</dom-module>

聚合物与contenteditable，execCommand和insertunorderedlist有关

0 个答案: