html
<ul id="a">
<li>这里需要编辑</li>
<li><a href="javascript:void(0);" class="b">编辑</a></li>
</ul>
有没有一种方法
使点击了“编辑”以后,“这里需要编辑”变成文本框input那种输入模式。
然后鼠标离开后,自动保存
<ul id="a">
<li>这里需要编辑</li>
<li><a href="javascript:void(0);" class="b">编辑</a></li>
</ul>
有没有一种方法
使点击了“编辑”以后,“这里需要编辑”变成文本框input那种输入模式。
然后鼠标离开后,自动保存
<li><span id="s">这里需要编辑</span><input type="text" id="t" style="display:none" onblur="ee()"/></li>
<li><a href="javascript:void(0);" class="b" onclick="se()">编辑</a></li>
</ul><script type="text/javascript">
var ss = document.getElementById("s");
var tt = document.getElementById("t");se = function(){
tt.value = ss.innerHTML;
ss.style.display = "none";
tt.style.display = "block";
}ee = function(){
ss.innerHTML = tt.value;
tt.style.display = "none";
ss.style.display = "block";}</script>
<li contentEditable="true">这里需要编辑</li>
<li><a href="javascript:void(0);" class="b">编辑</a></li>
</ul><script type="text/javascript"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><body><ul id="a">
<li>这里需要编辑</li>
<li><a href="javascript:void(0);" class="b">编辑</a></li>
</ul><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var li = $("#a>li:first");
var a = $("#a a");
a.click(function(){
li.attr("contentEditable",true)
});
li.mouseout(function(){
li.attr("contentEditable",false)
})
})
</script>
</body>
</html>