Проблема с JS/JQuery execCommand

У меня возникли проблемы (полные) с execCommand, поэтому ваша помощь очень ценится - я не сомневаюсь, что лаю не по тому дереву, но ..... в любом случае

У меня есть такой див

<div class="editable" id="editor" contenteditable="true"> 
    <2>Some text in here</h2> blah blah blah ...
</div>

Это "редактируемый", то есть document.designMode = 'on'; - это "состояние" в фокусе. При размытии меняется на document.designMode = 'off';

У меня есть "тестовая кнопка"

<input type="button" id="bold" value="Bold"> 

Это при «щелчке» делает «выделенный текст» жирным шрифтом - следовательно, execCommand

Пока у меня что-то вроде этого:

function getSelected() {
if(window.getSelection) { return window.getSelection(); }
else if(document.getSelection) { return document.getSelection(); }
else {
var selection = document.selection && document.selection.createRange();
if(selection.text) { return selection.text; }
return false;
}
return false;
}


$('#bold').click(function(){
var selection = getSelected();
alert(selection);
});

Предупреждение (жирный щелчок) действительно дает мне выделенный/выделенный текст, но я не могу понять, как «повернуть его» жирным шрифтом. Думаю, мне нужно получить доступ к innerHTML или что-то в этом роде?

Помощь очень ценится - спасибо заранее. О, и я не хочу использовать ни i-frame, ни textarea


person Russell Parrott    schedule 16.03.2011    source источник


Ответы (1)


Я настоятельно рекомендую использовать Rangy для выделения текста.

Кроссбраузерный диапазон JavaScript и библиотека выбора. Он предоставляет простой основанный на стандартах API для выполнения общих задач DOM Range и Selection во всех основных браузерах, абстрагируя совершенно разные реализации этой функциональности между Internet Explorer и браузерами, совместимыми с DOM.

Вы можете использовать модуль применения классов CSS, чтобы выделить текст жирным шрифтом (демонстрация).

person Matt Ball    schedule 16.03.2011
comment
Мэтт эмммммм... ОГРОМНОЕ спасибо за то, что Рэнджи открывает ГОРАЗДО больше возможностей, с которыми я раньше не сталкивался. Это не противоречит UI Sortables, поэтому, когда я имею в виду возможности . как я уже сказал ... ммм. Просто нужно понять несколько вещей с ним, но он выглядит как один из тех бесценных. Не заходя далеко, похоже, что я действительно могу комбинировать некоторые аспекты кроссбраузерности HTML5 без конфликтов. Очень признателен, поэтому 2 голоса и ответ - person Russell Parrott; 16.03.2011
comment
Без проблем. Пожалуйста. Кстати, я почти уверен, что сопровождающий находится на SO. edit нашел его. - person Matt Ball; 16.03.2011