首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

动态改变div内容有关问题

2012-05-14 
动态改变div内容问题。divaaaaaadiv怎么单击这个div后,在该div的上方弹出一个文本框(内容就是div的内容

动态改变div内容问题。
<div>aaaaaa<div>
怎么单击这个div后,在该div的上方弹出一个文本框(内容就是div的内容‘aaaa’),在文本框中输入修改后的信息,然后回车之后,div中显示新内容?
请问该怎么实现呢?谢谢各位!!!

[解决办法]
<div id="s1" onclick="f()">aaaaaa <div>
<input type="text" id="s2" onblur="g()" style="display:none;"/>
<script>
function f()
{
document.getElementById("s2").style.display="";
}
function g()
{
document.getElementById("s1").innerHTML=document.getElementById("s2").value;
}
</script>
[解决办法]

HTML code
<SCRIPT LANGUAGE="JavaScript">function setd(e,value){    e = e||window.event    var key = e.charCode||e.keyCode    if(key==13)        document.getElementById("d").innerHTML=value;}</SCRIPT><INPUT TYPE="text"  onkeyup="setd(event,this.value)"><div id=d onclick="alert(this.innerHTML)">aaaaa</div>
[解决办法]
JScript code
<html ><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title></head><body><SCRIPT LANGUAGE="JavaScript">function setd(e,value){    e = e||window.event    var key = e.charCode||e.keyCode    if(key==13)        document.getElementById("d").innerHTML=value;}function ShowTxt(){   document.getElementById("txt").style.display="block";}</SCRIPT><INPUT id="txt" TYPE="text" style="display:none"  onkeyup="setd(event,this.value)"><div id="d" onclick="ShowTxt()">aaaaa</div></body></html>
[解决办法]
我又看错问题内容了……
HTML code
<div id="test" onclick="demo()">aaaaaa<div><script>function demo(){     var str=document.getElementById('test').firstChild.data;    str = "<input name='testInput' type='text' onkeyup='setd(event,this.value)' value='"+str+"' onblur='enter(this.value)'>";    document.getElementById('test').onclick=function(){};    document.getElementById('test').innerHTML=str; }function enter(value){    document.getElementById("test").innerHTML=value;    document.getElementById('test').onclick = demo;}function setd(e,value){    e = e||window.event    var key = e.charCode||e.keyCode    if(key==13)    {        document.getElementById("test").innerHTML=value;        document.getElementById('test').onclick = demo;    }}</script> 

热点排行