Вставка в contentEditable Div автоматически вставляет другой HTML - PullRequest
Новая
       0

Вставка в contentEditable Div автоматически вставляет другой HTML

1 голос
/ 17 августа 2010

Я использую div с атрибутом contentEditable, чтобы удовлетворить мои потребности как простое кросс-браузерное решение для расширения текстовых полей, но я столкнулся с интересной проблемой.

Вот div: 

<div id="expanderInput" class="inputDiv" contentEditable></div>

Вот где я беру это в jquery: 

var forwardsTo = $expanderInput.html();

В большинстве случаев это возвращает все, что пользователь ввел в div, но странные вещи случаются, когда они начинают вставлять туда вещи.

Например, когда вы вставляете из Word, он правильно отображает текст в браузере, но добавляет дополнительный HTML-код внутри div. Когда я вставляю адрес электронной почты, такой как «bob@aol.com» из word, вот код, который он действительно вставляет в html: 

<P style="MARGIN: 0in 0in 10pt" class=MsoNormal><FONT size=3><FONT face=Calibri>bob@aol.com<o:p></o:p></p>

Это создает проблему при попытке получить простой текст, вставленный пользователем, так как он также захватывает HTML-код, что затрудняет правильный анализ.

Есть ли способ ограничить то, что пользователь может вставить в div? Или просто сделать так, чтобы можно было вставить только простой текст?

1 Ответ

2 голосов
/ 17 августа 2010

Как насчет захвата только .text()? 

var forwardsTo = $expanderInput.text();

Это не идеальное решение, так как ваш пользователь думает, что он может вставить жирный / курсивный текст и обнаружит, чторазметка была убрана.Возможно, вы можете применить 

$expanderInput.text($expanderInput.text());

к каждому событию вставки.Это немедленно удалит разметку.

...