js里INPUT的求救！

super2 2007-11-14 11:56:25

做了半天没有做成，求救大家了。
想做一个表单，里面有INPUT，然后在INPUT里输入数据后，当光标离开INPUT里，那么INPUT消失，数据还停留在原来的地方不消失。当想修改这个数据时，刚才消失的INPUT又出现，这时可以改数据，就是想不明白，哪位大侠能给个好建议，代码片段也可！谢谢

...全文

177 17 打赏收藏转发到动态举报

写回复

用AI写文章

17 条回复

切换为时间正序

请发表友善的回复…

发表回复

tantaiyizu 2007-11-14

打赏
举报



var h = function(){

	inp.style.display = "none";

	dv.style.display = "";

	bu.style.display = "";

	dv.innerText = inp.value;

};

var s = function(){

	bu.style.display = "none";

	dv.style.display = "none";

	inp.style.display = "";

};



<input id="inp" onblur="h()">

<input id= "bu" type="button" value="输入" onclick="s()" style="display:none;">

<div id="dv" style="display:none;"></div>

super2 2007-11-14

打赏
举报

等。。。。。。。。。。。。。

「已注销」 2007-11-14

打赏
举报



<input type="text" value="default value" style="border:0px;"

    onmouseover="this.style.border='1px solid #cccccc';"

    onmouseout="this.style.border='0px';this.blur();">

西安风影 2007-11-14

打赏
举报

8樓方法可取.

tantaiyizu 2007-11-14

打赏
举报

这么多人为你解答，还不满意吗？

还不结贴？

lip009 2007-11-14

打赏
举报

改成双击事件不就可以了么



<table border="1">

    <tr>

        <td width="200" height="40" ondblclick="show(this);"><input type="text" onmouseout="hidden(this);"></td>

    </tr>

</table>

<script>

    function show(obj){

        var input=obj.firstChild;

        if(input.style.display=="none"){

            input.style.display="";

            obj.removeChild(input.nextSibling);

        }

    }

    function hidden(obj){

        if(obj.style.display==""){

            obj.style.display="none";

            var text=document.createTextNode(obj.value);

            obj.parentNode.appendChild(text);

        }

    }

</script>

etwsj 2007-11-14

打赏
举报

学习

HonorsOffice 2007-11-14

打赏
举报

8樓方法可取.

super2 2007-11-14

打赏
举报

当再点一次的时候需要，多点一次INPUT激活有光标后才能出来

lip009 2007-11-14

打赏
举报

改点FF下的小BUG



<table border="1">

	<tr>

		<td width="200" height="40" onclick="show(this);"><input type="text" onmouseout="hidden(this);"></td>

	</tr>

</table>

<script>

	function show(obj){

		var input=obj.firstChild;

		if(input.style.display=="none"){

			input.style.display="";

			obj.removeChild(input.nextSibling);

		}

	}

	function hidden(obj){

		if(obj.style.display==""){

			obj.style.display="none";

			var text=document.createTextNode(obj.value);

			obj.parentNode.appendChild(text);

		}

	}

</script>

lip009 2007-11-14

打赏
举报

<table border="1">

	<tr>

		<td width="200" height="40" onclick="show(this);"><input type="text" onmouseout="hidden(this);"></td>

	</tr>

</table>

<script>

	function show(obj){

		var input=obj.firstChild;

		if(input.style.display=="none"){

			input.style.display="";

			obj.removeChild(input.nextSibling);

		}

	}

	function hidden(obj){

		obj.style.display="none";

		var text=document.createTextNode(obj.value);

		obj.parentNode.appendChild(text);

	}

</script>

glvicky 2007-11-14

打赏
举报



<style>

.ipt {border:1px solid #ffffff;}

.ipt2 {border:1px solid #000000;}

</style>

<script>

function _con(i){

	if(i == 1){

		ipt.className = "ipt2";

		ipt.readOnly = false;

	}else{

		ipt.className = "ipt";

		ipt.readOnly = true;

		ipt.blur();

	}

}

</script>

<input id="ipt" class="ipt" onclick="_con(1);" onmouseout="_con(0);" value="aaa" readonly="true">

glvicky 2007-11-14

打赏
举报

你可以这样子嘛~``
不修改的时候，其实也是一个INPUT，但它的边框没有，或者边框颜色和背景相同，这样子，就看不出来是一个INPUT了，并且把这个INPUT设置成READONLY，修改的时候则显示边框，去除REALONLY~``这样子最简单了~``

nicholsky 2007-11-14

打赏
举报

这个是display或者visibility的问题。2楼的正解，最好用document.getElementById标准写。

tyq0318 2007-11-14

打赏
举报

做个标记。。

z109876543210 2007-11-14

打赏
举报

http://hi.baidu.com/lael80/blog/item/47d964d99de579e938012f6f.html

http://www.gzyd.net/lael/control.html

xuStanly 2007-11-14

打赏
举报



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

 <HEAD>

  <TITLE> New Document </TITLE>

  <META NAME="Generator" CONTENT="EditPlus">

  <META NAME="Author" CONTENT="">

  <META NAME="Keywords" CONTENT="">

  <META NAME="Description" CONTENT="">

  <script>

	function doinput(){

		var val = aa.innerText;

		aa.innerHTML = "<input type=text onblur=dodis(this) value=\""+val+"\">";

	}

	function dodis(obj){

		var val = obj.value;

		aa.innerHTML = "";

		aa.innerText = val;

	}

  </script>

 </HEAD>



 <BODY>

  <span id=aa ondblclick=doinput()><input type=text onblur=dodis(this)></span>

 </BODY>

</HTML>