JS双击div编辑文本内容
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); }); } } }); }