您的位置:首页 > Web前端 > JavaScript

JS双击div编辑文本内容

2014-11-13 10:18 183 查看
HTML代码:

<div class="album">
<div class="image"><a href="javascript:;" onclick="view({$vo.id})"><img src="{$vo.img}" /></a></div>
<div class="name" id="{$vo.id}" ondblclick="edit(this,{$vo.id})">{$vo.name}</div>
</div>


  

JQuery代码:

function edit(msg,id){
var text = $(msg).text();
$(msg).html("<input type='text' name='album' value='"+text+"' size=20");
$("input[name='album']").focus();
$("input[name='album']").blur(function(){
var name = $(this).val();
if(name.indexOf(" ") >= 0 || name == ""){
alert("相册名称不能为空且不能含有空格!");
$("input[name='album']").focus();//获取焦点
$("input[name='album']").select();//input内容选中
}else{
if(text == name){
$(msg).html(text);
}else{
$.get( url+"edit?id="+id+"&name="+encodeURI(name), function(result){
if(result != ''){alert(result);}
$(msg).html(name);
});
}
}
});
}


  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: