JS双击div编辑文本内容

HTML代码:

1
2
3
4
<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代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
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);
                });
            }
        }
    });
}

  

posted @   贱书生  阅读(1659)  评论(0编辑  收藏  举报
努力加载评论中...
点击右上角即可分享
微信分享提示