Jump to content

Couple Problems


pizzaguy

Recommended Posts

Ok, i've tried everything I can think of and I can't seem to get these working.My first problem is that I can't seem to be able to replace the characters &,",',<, and > with their respective entities. My second problem is this: when the div element is clicked the innerHTML is changed and the onclick event is removed, and when focus is blurred the onclick event should be added, but it doesn't and I can't figure out why. here is my code:

<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">	<head>		<script type="text/javascript">		function singleInputInit(obj){			var current_text = obj.innerHTML;			obj.innerHTML = "<input type=\"text\" value=\"" + current_text + "\" onblur=\"singleInputWrite(this)\"></input>";			obj.firstChild.focus();			obj.firstChild.select();			obj.onclick = "";		}		function singleInputWrite(obj){			var current_text = obj.value;			var parent = obj.parentNode;			parent.onclick = "singleInputInit(this)";			current_text = current_text.replace(/&/g, "\&#38;");			current_text = current_text.replace(/\"/g, "\&#34;");			current_text = current_text.replace(/\'/g, "\&#39;");			current_text = current_text.replace(/</g, "\&#60;");			current_text = current_text.replace(/>/g, "\&#62;");			parent.innerHTML = current_text;		}		</script>	</head>	<body>		<div id="container">			<div id="info-l1">				<div class="info-container">				<div class="info-label">Name: </div><div class="single-input large" onclick="singleInputInit(this)"></div>				</div>			</div>		</div>	</body></html>

Link to comment
Share on other sites

don't know exactly what you trying to achieve with this? but the reason it wont convert is because there's no innerHTML content to convert, it's empty <div class="single-input large" onclick="singleInputInit(this)">(empty-null-void-vacant-basically nothing to convert)</div> if it had something like this:<div class="single-input large" onclick="singleInputInit(this)"><<<<<<<<<<<&>>>>>>>>>>></div>it would create a input box within this containing div, with this innerHTML text selected. when losing focus (onblur) it takes the content value in the input box, converts it, and then overwrites the input box with the converted text ONLY. <div class="single-input large" onclick="singleInputInit(this)"><<<<<<<<<<<&>>>>>>>>>>></div>

Link to comment
Share on other sites

What I'm doing is this: The when you click on the div, the singleInputInit is triggered and an input box is placed in the div. When you are done typing in the input box and you click somewhere else, the div is blurred causing singleInputWrite to take the text from the input box and make that the content of the div.

<div></div>-div is clicked-<div><input value="bla"></input></div>-input is blurred-<div>bla</div>

Link to comment
Share on other sites

i've managed to create this, but with two options available (comment out code below options listed to tryout)option 1 keep input box displayedoption 2 remove input box, and only show if current text clicked<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript">/*<![CDATA[*//*---->*/ function singleInputInit(obj){ obj.innerHTML = "<input type=\"text\" value=\"\" onblur=\"singleInputWrite(this)\">"+previous_current_text; obj.firstChild.focus(); obj.firstChild.select(); }var previous_current_text="";function singleInputWrite(obj) { var current_text = obj.value; var parent = obj.parentNode; current_text = current_text.replace(/&/g, "&"); current_text = current_text.replace(/\"/g, """); current_text = current_text.replace(/\'/g, "'"); current_text = current_text.replace(/</g, "<"); current_text = current_text.replace(/>/g, ">"); previous_current_text+= (" ")+current_text; alert(current_text) //option 1 keep input box displayed parent.innerHTML = "<input type=\"text\" value=\"\" onblur=\"singleInputWrite(this)\"></input>"+previous_current_text; //option 2 remove input box, and only show if current text clicked //parent.innerHTML = previous_current_text; //obj.onclick = "singleInputInit(this)"; }/*--*//*]]>*/</script> </head> <body> <div id="container"> <div id="info-l1"> <div class="info-container"> <div class="info-label">Name: <div class="single-input large" onclick="singleInputInit(this)">Show Input</div></div> </div> </div> </div> </body></html>

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...