Главная страница статей --> Советы по фотошопу, графике и хитрости в построении php кода

Редактирование текстовых элементов

Источник: realcoding.net

В версию 5.5, всенародно любимого браузера ;), ввели очень интересное свойство contentEditable. Используя это свойство к любому элементу HTML-документа, вы можете его (элемент) редактировать прямо в окне браузера (elementID.contentEditable=true). А самое главное то, что после внесения изменений, можно отключить редактирование и наслаждаться результатом не перезагружая сам документ (elementID.contentEditable=false). Теперь Internet Explorer можно использовать как простенький WYSIWYG-редактор.

Пример использования редактирования элемента:

<html><head><title>
Редактируем DIV </title>
</
head>
<
body bgcolor=white text=black>
<
div contentEditable=true>
Этот текст редактируемый.
</
div>
</
body></html>

Также, вы можете создать кнопку которая будет переключать режимы редактирования (включить/отключить). В этом вам поможет свойство isContentEditable, которое возвращает true если объект можно редактировать, или false если нельзя.

Добавим в наш пример кнопку (включить/отключить):

<html><head><title>
Редактируем DIV </title>
<
script language=jscript>
function
onOff(){
sButton.value =
(
eDiv2.isContentEditable)
?
включить редактирование
: отключить редактирование;
eDiv2.contentEditable =
(
eDiv2.isContentEditable)
?
false
: true;
}
</script>
</head>
<body bgcolor=white text=black>
<div id=eDiv2
contentEditable=false>
Этот текст редактируемый.</div>
<p><button id=sButton
onClick=onOff(); style=width:240px;>
включить редактирование</button>
</body></html>

Но это не все! Для изменения начертания редактируемого текста, вы можете использовать клавиатурные сокращения. Не полный список представлен в таблице:

Не полный список клавиатурных сокращений. Ctrl + B полужирный (тег STRONG).

Ctrl + I курсив (тег EM).
Ctrl + U подчеркнутый (тег U).
Ctrl + K создать ссылку (тег А).
ENTER параграф (тег P)
Shift + ENTER перевод строки (тег BR)
Ctrl + Alt + C его величество copyright ©



Похожие статьи:
- Локальная реклама
- Сокращение времени загрузки веб-страниц с помощью CSS
- Совет дня на JavaScript
- Использование фонового изображения для замены текста
- Как совместить пиксел к пикселу фон и содержимое во всех браузерах
- Мета-поиск - лучший друг
- Формат и синтаксис Cookie
- Работа с ссылками - Построении ссылок с помощью JavaScript
- Создание файлов при помощи JavaScript и VBScript


Оглавление | Обсудить на форуме | Главная страница сайта | Карта сайта |

Контакты
Редакция:
[0.001]