Как убрать все теги div, но не контент, который у него есть?(Работа с contenteditable = "true", HTML5) - PullRequest
1 голос
/ 10 марта 2012

Как убрать все теги div, но не контент, который у него есть? (Работа с contenitable = "true", HTML5)

У меня не настоящая текстовая область - просто <div> с contenteditable="true". Когда я нажимаю кнопку «отправить», код читает innerHTML этого элемента. Это не хорошо.

Итак, я хочу использовать его в качестве текстовой области, мне нужно:

  1. Удалить теги <div> без содержимого (когда я начинаю новую строку, браузер закрывает предыдущий <div> (если существует) и запускает новый <div>.
  2. Удалите все остальные теги, отличные от <br /> (но если <br> пометит больше 2 в строке, удалите его).

Как это реализовать? На стороне сервера и на стороне пользователя (потому что он отправляет по xhr).

Ответы [ 3 ]

0 голосов
/ 10 марта 2012

В прошлом я использовал редактируемые элементы содержимого, лучший способ использовать их косвенно; вместо того, чтобы они бросали контент на php, имейте где-то скрытый textarea, с кнопкой «отправка» (очевидно, «отправка» не скрыта) и затем редактируемый контент div в другом месте. Затем вы можете использовать jQuery, чтобы захватить содержимое вашего div, а затем использовать какое-то прикольное регулярное выражение, чтобы проанализировать его для ваших тегов <br /> и <div> и </div>.

<div contenteditable="true" style="width:200px; height:100px;" id="InputDiv">
...
</div>

<form action="something.php">
    <textarea id="InputArea" style="visibility:hidden;">
    <input onclick="getData()"type="submit" value="submit" >
</form>

С соответствующим jQuery:

function getData(){
    var rawDiv = $("#InputArea").text();
    var parsedStr = /*some funky regex*/;
    $("#InputArea").text(parsedStr);
}

Я, кажется, неуместно в моей предыдущей работе с jquery и contenteditable div, но что-то в этом направлении должно работать.

Альтернатива:

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

0 голосов
/ 10 марта 2012

Это делает трюк:

document.getElementById(/*your_div_to_be_removed*/).removeNode(false);
0 голосов
/ 10 марта 2012

получите своего родителя <div>, клонируйте узел и просмотрите клонированное дерево: удалите узлы <div>, у которых нет содержимого, и другие запрещенные теги.

Когда вы закончили обход, выможет передать то, что осталось от вашего Дом-элемента.

...