Here's half of what you asked for:
HTML Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Create Links</title>
<script type="text/javascript">
<!--//
function CreateHTML(url, txt, opt, html, output) {
var str;
if (str = GetCheckedValue(opt)) {
url.value = url.value.trimEnds();
url.value = url.value || "some url";
txt.value = txt.value.trimEnds();
txt.value = txt.value || "some text";
if (str == 'LINK') {
str = '<a href="' + url.value + '">' + txt.value +'</a>';
}
else {
str = '<img src="' + url.value + '" border="0" alt="' + txt.value + '">';
}
html.value = str;
output.innerHTML = str;
}
return true;
}
function GetCheckedValue(grp) {
var x, len = grp.length;
for (x=0; x<len; ++x) {
if (grp[x].checked) return grp[x].value;
}
return null;
}
String.prototype.trimEnds = function () // trim white-space off both ends of object string
{
return this.replace(/(^\s+)|(\s+$)/g, ''); // return trimmed string
}
//-->
</script>
</head>
<body>
<form action="" onsubmit="return false">
<p>URL: <input type="text" name="url" size="32"> Text:
<input type="text" name="text" size="20"></p>
<p><label for="lbl1">Hyperlink:<input type="radio" name="opt" value="LINK" id="lbl1"></label>
<label for="lbl2"><input type="radio" name="opt" value="IMAGE" id="lbl2">:Image</label></p>
<p><input type="button" value="Create HTML"
onclick="return CreateHTML(url, text, opt, html, document.getElementById('output'))"></p>
<p>HTML: <input type="text" name="html" size="60"></p>
</form>
<p>Example output:<br>
<div id="output"> </div></p>
</body>
</html>
Bookmarks