|
|
|
| Здравствуйте!
<textarea id="elem">
текст текст
</textarea>
|
Нужно такую штуку сделать, чтобы выделить текст и нажать потом на кнопку и чтоб этот текст обрамился тегом \[b\]текст текст\[/b\] и чтоб все это было видно в текстовом поле. Типа как на этом сайте...
в js не силен. Это наверно делается через регулярку, типа
<script>
$('.anyButton').click(function () {
$('#elem').val().replace(/как определить выделеную часть текста?/i, function () {return "\[b\] + $(this) + "\[/b\]";});
});
}
</script>
|
скорее всего есть синтаксические ошибки, но не важно :) Подскажите как определить выделеную часть текста и засунуть в регулярку... Других способов не знаю, как это вообще правильно делается..
ps ставил обратные слеши в \[b\], а то не видно этих тегов | |
|
|
|
|
|
|
|
для: ladan
(08.12.2012 в 14:42)
| | >"Типа как на этом сайте..."
а типа открыть "исходный текст" этой типа страницы
и типа посмотреть - как здесь это типа устроено
вы типа не догадались?
а вы типа попробуйте... типа попытка не пытка | |
|
|
|
|
|
|
|
для: ladan
(08.12.2012 в 14:42)
| | Типа это делается в типа диве с типа эдитейбл типа тру. | |
|
|
|
|
|
|
|
для: Deed
(08.12.2012 в 17:57)
| | нет, Deed
типа товарищу нужны не типа теги <b></b>, а типа псевдотеги типа [тег][/тег]
так что типа эдитейбл типа тру ему типа совсем не нужен | |
|
|
|
|
|
|
|
для: ЯСА
(08.12.2012 в 18:01)
| | Тю!
Ну, типа, лана. А чтоб, в натуре, типа, пример не пропадал, все же, типа, опубликую.
Итак, встречаем!
execCcommand!
Но чтобы не морочиться возвратом фокуса в диве, его, типа, мона заменить на айфрейм:
<html>
<head>
<title>execCommand</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
function Init() {
document.getElementById("rte").contentWindow.document.designMode = "On";
}
function doBold() {
document.getElementById("rte").contentWindow.document.execCommand('bold', false, null);
}
function doItalic() {
document.getElementById("rte").contentWindow.document.execCommand('italic', false, null);
}
function doURL() {
var mylink = prompt("Enter a URL:", "http://");
if ((mylink != null) && (mylink != "")) {
document.getElementById('rte').contentWindow.document.execCommand("CreateLink",false,mylink);
}
}
function doImage() {
myimg = prompt('Enter Image URL:', 'http://');
document.getElementById('rte').contentWindow.document.execCommand('InsertImage', false, myimg);
}
</script>
<style>
#rte{
border:1px solid green;
width:645px;
height:291px;
}
</style>
</head>
<body onLoad="Init();">
<input type="submit" name="btnBold" value="bold" on id="btnBold" onClick="doBold();">
<input type="submit" name="btnItalic" id="btnItalic" value="italic" onClick="doItalic();">
<input type="submit" name="btnURL" id="btnURL" value="URL" onClick="doURL();">
<input type="submit" name="btnImg" id="btnImg" value="Image" onClick="doImage();">
<br>
<iframe id="rte"></iframe>
</body>
</html>
|
https://developer.mozilla.org/en-US/docs/Rich-Text_Editing_in_Mozilla
http://forums.devshed.com/html-programming-1/execcommand-problem-in-contenteditable-div-125950.html
типа.
P.S. Хорошая статья для понимания сути проблемы: http://learn.javascript.ru/vydelenie-range-textrange-i-selection | |
|
|
|
|
|
|
|
для: Deed
(08.12.2012 в 18:34)
| | Типа об этом все знают, но все таки спрашивали совсем не об этом, да и не нужно оно. | |
|
|
|
|
|
|
|
для: Deed
(08.12.2012 в 18:34)
| | спасибо за пример! Но немножко не то. По совету ЯСА обращусь к исходному коду, может типа что и получится ) | |
|
|
|
|
|
|
|
для: ЯСА
(08.12.2012 в 18:01)
| | надо было тему переименовать в типа "типа как такое сделать типа" )) | |
|
|
|
|
|
|
|
|
для: DJ Paltus
(09.12.2012 в 21:27)
| | О спс !! то что надо)) | |
|
|
|