Her er et javascript der gør det, inkluderet i en side der tester det.
Du kan altså spare din processorkraft, og lade browseren gøre det ;-)
<html>
<head>
<title>AddDivLink</title>
<style>
body { font-family : sans-serif;}
textarea { font-family : monospace; }
#container { font-family : monospace; border : 1px solid black; width : 1000px; padding : 5px; }
</style>
<script>
function AddDivLink(text) {
if (text.length==0) {
return "";
}
var i_start = text.indexOf("<img");
if (i_start==-1) {
return text;
}
var i_len = text.substr(i_start).indexOf(">");
if (i_len == -1)
i_len = text.length-i_start;
else
i_len++;
var i_end = i_start + i_len;
var hrefA, hrefB = "";
var s_start = text.indexOf("<img src=") + 9;
if (s_start>8) {
var s_len = text.substr(s_start).indexOf(">");
hrefA = "<a href=" + text.substr(s_start, s_len ) + ">";
hrefB = "</a>";
}
return text.substr(0, i_start) + hrefA + '<div class=image>' + text.substr(i_start, i_len) + '</div>' +
hrefB + AddDivLink(text.substr(i_end) );
}
function UpdateTags() {
document.getElementById('container').innerHTML = AddDivLink(document.F1.T1.value);
document.F1.T2.value=AddDivLink(document.F1.T1.value);
}
</script>
</head>
<body onLoad="UpdateTags();document.F1.T1.focus();">
<form name="F1">
Insert test with image tags here here:<br />
<textarea name="T1" cols="110" rows="12" onKeyUp="UpdateTags();">
X bla bla bla bla X<img src=img/img-01.jpg>X bla bla bla bla bla bla X
</textarea>
<br />Result rendered:
<div id="container" ></div>
Result source:<br />
<textarea name="T2" cols="110" rows="12" >
</textarea>
</form>
</body>
</html>
