Замена Тегов в textarea
есть Переменная
var div_1 = $("#textarea").val(); // в нее приходит код html среди которого несколько тегов <img scr="A.tip" alt="B" width="C" height="D" border="F"/> <img scr="A2.tip" alt="B2" width="C2height="D2 border="F2"/> необходимо заменить их на <div style="background:url(A.tip) no-repaet; width:C px; height:D px; margin:F auto;> <div style="background:url(A2.tip) no-repaet; width:C2 px; height:D2 px; margin:F2 auto;></div> Подскажите пожалуйста в каком направлении двигаться ? |
arahmanov,
:)
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
var a = $("#textarea").val(),
a = $("<div>", {
html: a
});
a.find("img").each(function(a, b) {
var c = $("<div>", {
css: {
background: "url(" + b.getAttribute("src") + ") no-repeat",
width: b.width + "px",
height: b.height + "px",
margin: b.border + "px auto"
}
});
$(b).replaceWith(c)
});
$("#textarea").val(a.html())
});
</script>
</head>
<body>
<textarea id="textarea" name="" rows="8" cols="70">
<img src="A.tip" alt="B" width="100" height="200" border="2"/>
<img src="A2.tip" alt="B2" width="123" height="345" border="4"/>
</textarea>
</body>
</html>
|
Спасибо РОНИ :))))
|
Продолжение следует......
Задача моя была сделать кнопку для joomla редактора которая автоматом бы меняла бы <img scr="A.tip" alt="B" width="C" height="D" border="F"/> на <div style="background:url(A.tip) no-repaet; width:C px; height D px; margin:F auto;> но учитывая непонятную мне специфику работы joomla вариант РОНИ просто отказывается работать Поэтому я пошел еще более простым путем
$jsCode = "
function insertCustText(editor) {
var a = document.getElementById('jform_articletext').value; // Получаем Html код из редактора
var res = a.replace(/img/g,\"div\") // Заменяем все img на div
res = res.replace(/scr=/g, \"style='background:url(\"); // заменяем scr на style
res = res.replace(/alt/g, \") no-repeat; name\"); // чтобы сохранить тег alt для обратный замены меняем его на name
res = res = res.replace(/width/g,\"; width\") //
res = res = res.replace(/height/g,\"; height\") //
res = res = res.replace(/border=\"/g,\"; margin:\") //
document.getElementById('jform_articletext').value = res;
}
";
и результат вот такой <div style='background:url("A.tip" ) no-repeat; name="B" ; width="C" ; height="D" ; margin:F"/> помогите разобраться осталось как то удалить name="" и убрать кавычку <"> но как бы я не пробовал кавычка не убирается из-за экранирования в php а как удалить значение name вообще ума не приложу! Спасибо! |
arahmanov,
вариант заменить в коде все $ на jQuery |
| Часовой пояс GMT +3, время: 14:18. |