看看这个应该怎么做，进来看看吧
日期：2014-05-16 浏览次数：20555 次
看看这个应该如何做，进来看看吧
要求：
点击这条信息，在这个div中添加一个文本框，一个按钮，这个文本康里面的内容是这个div里面的内容，然后点击这个按钮，把文本框里面修改的内容赋给这个div
不知道描述的清楚不，望各位帮忙解决下
------解决方案--------------------
- HTML code
<div>
<div onclick="txtReplick">第一条测试</div>
<div onclick="txtReplick">第二条测试</div>
<div onclick="txtReplick">第三条测试</div>
</div>
要求：
点击这条信息，在这个div中添加一个文本框，一个按钮，这个文本康里面的内容是这个div里面的内容，然后点击这个按钮，把文本框里面修改的内容赋给这个div
不知道描述的清楚不，望各位帮忙解决下
------解决方案--------------------
- HTML code
<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<link rel="stylesheet" href="http://yui.yahooapis.com/2.9.0/build/reset/reset-min.css" />
<style>
body {font-size:12px;}
</style>
</head>
<body>
<div onclick="txtReplick">第一条测试</div>
<div onclick="txtReplick">第二条测试</div>
<div onclick="txtReplick">第三条测试</div>
<script>
function $(el){
return typeof el == 'string' ? document.getElementById(el) : el;
}
function $t(name, cot){
cot = cot || document;
return cot.getElementsByTagName(name);
}
var divs = $t('div');
for(var i=0, len=divs.length; i<len; i++){
divs[i].onclick = function(){
if( $t('input', this).length ) return ;
var c = document.createElement('div');
c.innerHTML = '<input value="'+this.innerHTML+'" /><button>修改</button>';
this.appendChild(c);
var that = this;
$t('button', this)[0].onclick = function(e){
that.innerHTML = $t('input', that)[0].value;
e = e || window.event;
if (e.stopPropagation) {
e.stopPropagation();
} else {
e.cancelBubble = true;
}
}
}
}
</script>
</body>
</html>
------解决方案--------------------
- HTML code
<div>
<div onclick="txtReplick(this)" flag="off">第一条测试</div>
<div onclick="txtReplick(this)" flag="off">第二条测试</div>
<div onclick="txtReplick(this)" flag="off">第三条测试</div>
</div>
<script type="text/javascript">
function txtReplick(el){
var bool=el.getAttribute('flag');
if(bool=='off'){
el.setAttribute('flag','on')
var tf=document.createElement('input');
tf.type='text';
tf.value=el.innerHTML;
el.appendChild(tf);
var btn=document.createElement('input');
btn.type='button';
btn.value='更改';
el.appendChild(btn);
btn.onclick=function(event){
stopBubble(event);
el.innerHTML=tf.value;
el.setAttribute('flag','off');
el=null;
}
}
}
function stopBubble(e){
if(e && e.stopPropagation){
e.stopPropagation(); //w3c
}else window.event.cancelBubble=true; //IE
}
</script>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
