Форум PHP программистов > добавление тэгов в стринг без перезагрузки

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: добавление тэгов в стринг без перезагрузки

qpayct

23.12.2008 - 09:38

Здрасте.

Я понимаю что это надо делать на jаvаscript. Прошу меня поправить и показать мне правильный подход.
Делаю так:

HTML

<html>
<head>
<title>TextRedactor</title>
<style>
.knopka_bold {
background: url(images/buttons/bold.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_italic {
background: url(images/buttons/italic.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_underline {
background: url(images/buttons/underline.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_left {
background: url(images/buttons/left.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_center {
background: url(images/buttons/center.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_right {
background: url(images/buttons/right.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_font {
background: url(images/buttons/font.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_color {
background: url(images/buttons/color.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_size {
background: url(images/buttons/size.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_link {
background: url(images/buttons/link.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_image {
background: url(images/buttons/image.gif) top center no-repeat;
cursor:pointer;
border: none;
}
.knopka_quote {
background: url(/images/buttons/quote.gif) top center no-repeat;
cursor:pointer;
border: none;
}
</style>
<script language="jаvаscript">
function doBold(str) {
alert (str);

}
function doItalic(str) {
alert (str);

}
function doUnderline(str) {
alert (str);

}
function doRight(str) {
alert (str);

}
function doCenter(str) {
alert (str);

}
function doLeft(str) {
alert (str);

}
function doFont(str) {
alert (str);

}
function doColor(str) {
alert (str);

}
function doSize(str) {
alert (str);

}
function doLink(str) {
alert (str);

}
function doImage(str) {
alert (str);

}
function doQuote(str) {
alert (str);

}
</script>
</head>
<body>
<table class="koteret">
<tr>
<td>כותרת ראשית : </td>
</tr>
<tr>
<td><input type="text" name="" size="100"/></td>
</tr>
<tr>
<td>כותרת משנה : </td>
</tr>
<tr>
<td><textarea cols="80" rows="6" name="" ></textarea></td>
</tr>
<tr>
<td>
<input type="button" class="knopka_bold" onclick="doBold(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_italic" onclick="doItalic(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_underline" onclick="doUnderline(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_right" onclick="doRight(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_center" onclick="doCenter(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_left" onclick="doLeft(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_font" onclick="doFont(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_color" onclick="doColor(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_size" onclick="doSize(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_link" onclick="doLink(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_image" onclick="doImage(document.getElementById('textbox').value);" value="" />   
<input type="button" class="knopka_quote" onclick="doQuote(document.getElementById('textbox').value);" value="" />   
</td>
</tr>
<tr>
<td><textarea cols="80" rows="22" id="textbox"></textarea></td>
</tr>
<tr>
<td><input type="submit" value="צור" /></td>
</tr>
</table>
</body>
</html>

Проблема такая. Надо же не всегда просто вставлять теги, а брать в теги открытия\закрытия выделеный отрезок текста.. Как быть с такими требованиями?
Спасибо.

Спустя 8 минут, 7 секунд (23.12.2008 - 08:46) Гость написал(а):

Если нужно брать весь текст из textarea например то:

<textarea cols="80" rows="6" name="" id="unique_id"></textarea>

onclick="doQuote(document.getElementById('unique_id').innerHTML)"

Если по поводу работу с выделенным текстом, лучше посмотреть сюда:
http://www.codenet.ru/webmast/js/sel/

Спустя 21 минута, 15 секунд (23.12.2008 - 09:07) qpayct написал(а):

Цитата (Гость @ 23.12.2008 - 05:46)

поправил код...
как оказалось .innerHTML это уже прошлое

надо использовать .value

за ссылочку спасибо. буду разбиратся.

Спустя 3 часа, 55 минут, 3 секунды (23.12.2008 - 13:02) Sylex написал(а):

Цитата (qpayct @ 23.12.2008 - 12:07)

как оказалось .innerHTML это уже прошлое

надо использовать .value

это не прошлое, это ваше неумение использовать нужные вещи в нужном месте

Спустя 2 дня, 17 часов, 49 минут, 48 секунд (26.12.2008 - 06:52) qpayct написал(а):

Цитата (Sylex @ 23.12.2008 - 10:02)

это не прошлое, это ваше неумение использовать нужные вещи в нужном месте

может вы и правы однако как я понимаю это работает только под старый стиль программирования и допустим Хром гугля не поддерживает такую вот шнягу.. да и W3C вроде не рекомендуется использовать как и <table>
а в остальном конечно вы правы.
ещё такой вопрос есть..
почему на форумах в текстовом редакторе принято вместо '<' использовать '[' ??

Спустя 8 дней, 8 часов, 17 минут, 57 секунд (4.01.2009 - 15:10) bret написал(а):

qpayct
http://ru.wikipedia.org/wiki/BBCode

Быстрый ответ:

Здесь расположена полная версия этой страницы.