js 使li 可编辑,该如何处理
日期：2014-05-20 浏览次数：20744 次
js 使li 可编辑
<ul>
<li id='a' onclick=''>
name
</li>
如何通过右击鼠标是a 属于可修改状态？ 求代码
------解决方案--------------------
<script>
function rightClick(obj) {
if(event.button == 2) {
var oldhtml = obj.innerHTML;
var newobj = document.createElement('input'
newobj.value = oldhtml;
newobj.type = 'text'
newobj.onblur = function(){
obj.innerHTML = this.value ? this.value : oldhtml;
}
obj.innerHTML = '';
obj.appendChild(newobj);
newobj.focus();
}
}
</script>
<ul>
<li id='a' onmousedown="rightClick(this)">name</li>
</ul>
------解决方案--------------------
以下代码IE8和火狐3.5测试通过。。
<ul>
<li id='a' onclick=''>
name
</li>
如何通过右击鼠标是a 属于可修改状态？ 求代码
------解决方案--------------------
<script>
function rightClick(obj) {
if(event.button == 2) {
var oldhtml = obj.innerHTML;
var newobj = document.createElement('input'
newobj.value = oldhtml;
newobj.type = 'text'
newobj.onblur = function(){
obj.innerHTML = this.value ? this.value : oldhtml;
}
obj.innerHTML = '';
obj.appendChild(newobj);
newobj.focus();
}
}
</script>
<ul>
<li id='a' onmousedown="rightClick(this)">name</li>
</ul>
------解决方案--------------------
以下代码IE8和火狐3.5测试通过。。
- HTML code
<html>
<head>
<script>
var isEdit = 0;
function changeValue(li)
{
if(isEdit++ != 0)
{
return false;
}
var oldValue = li.innerHTML;
li.innerHTML = "<input onblur='confirmChange(this)' value='"+oldValue+"'/>";
}
function confirmChange(input)
{
var newValue = input.value;
var li = input.parentNode;
li.innerHTML = newValue;
isEdit = 0;
}
</script>
</head>
<body>
<ul>
<li onclick="changeValue(this)">1</li>
<li onclick="changeValue(this)">2</li>
<li onclick="changeValue(this)">3</li>
</ul>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
