contenteditable добавление нескольких пробелов в конце нажатия клавиши

У меня есть contenteditable divс followi <div contenteditable = "true" class = "editor-note" id = "FqzHgBZeHHT3QECD2" > <span id = "mSFK7wMphfKgBaCQg" > Well </ span> <span id = "8jHKJyhFfqHw9WPpR" > over </ span> <span id = "EGmCtEKaiPJkMKGSE" > один </ span> <span id = "soDGqwvxvmzg9hF5W" > , </ span> <span id = "uTEWcPrqoq9tZGYnK" > my </ span> <span id = "8HQEjMNKLiv6XJkqp" > guest </ span> <span id = "bYzzWYq5P4jTHLQ4S" > сегодня </ span> <span id = "uey8ghQ4yNN62aY8J" > есть </ span> </ div> g HTML в нем

&nbsp;

Когда я хочу ввести в него дополнительный текст, когда я ввожу любой ключ, он добавляет много nв конце созданного div.

Этот gif показывает, что происходит: http://g.recordit.co/l8m6IQwmNb.gif

Это то, что происходит, когда я ввел одно письмо n

<div contenteditable="true" class="editor-note" id="FqzHgBZeHHT3QECD2">
  <span id="mSFK7wMphfKgBaCQg">Well</span>
  <span id="8jHKJyhFfqHw9WPpR">over</span>
  <span id="EGmCtEKaiPJkMKGSE">one</span>
  <span id="soDGqwvxvmzg9hF5W">,</span>
  <span id="uTEWcPrqoq9tZGYnK">my</span>
  <span id="8HQEjMNKLiv6XJkqp">guest</span>
  <span id="bYzzWYq5P4jTHLQ4S">today</span>
  <span id="uey8ghQ4yNN62aY8J">is</span>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;n
</div>

Здесь, как вы можете видеть, здесь много чего &nbsp;, как я могу решить эту проблему? Я пробовал это в сафари, такую ??же проблему, поэтому это совсем не связано с браузером.

Кроме того, к этому div нет слушателей событий.

Любая помощь оценивается, спасибо.

РЕДАКТИРОВАТЬ

Я использую рамки meteor js, и это html-код, который я использую для создания этого html

<div class="seg-editor">
  <div contenteditable="true" class="editor-note" id="{{segmentId}}">
    {{#each items}}
      <span id="{{_id}}">{{text}}</span>
    {{/each}}
  </div>
</div>

мой itemsпомощник просто возвращает значения из db, к нему не подключены прослушиватели событий

javascript,jquery,css,meteor,contenteditable,

2

Ответов: 2


0

Возможно, некоторые scriptили CSSв вашем коде будут причиной этого. Поэтому, пожалуйста, проверьте причину или опубликуйте скрипт, где эта проблема будет воспроизводиться.

Примечание. Проверьте свой код на chrome и firefox, и он работает нормально. Вы тоже можете проверить эту скрипку .


0 принят

Если я изменю свой код метеора, чтобы удалить пробелы в html, как показано ниже в одной строке

<div contenteditable="true" class="editor-note" id="{{segmentId}}">{{#each items}}{{showSpace @index}}<span id="{{_id}}">{{text}}</span>{{/each}}</div>

вместо распространения в несколько строк

<div class="seg-editor">
  <div contenteditable="true" class="editor-note" id="{{segmentId}}">
    {{#each items}}
      <span id="{{_id}}">{{text}}</span>
    {{/each}}
  </div>
</div>

что проблема с дополнительным пространством исчезла. Надеюсь, это поможет кому-то

JavaScript, JQuery, CSS, метеор, contenteditable,
Похожие вопросы