jQuery实现一个简单的todoLIst

var flag=1
var targetflag=0

//add|update
$(".btn").on("click",function() {
   
    var text = $(".content").val().trim()
    if (text.length !=0){
        if($(".btn").val()=="修改"){
            var tds=$("tbody tr td:nth-child(1)")
            for(var i=0;i<tds.length;i++){
                if(tds.eq(i).attr("index")==targetflag){
                    tds.eq(i).text(text)
                }
            }
            $(".btn").val("添加")
            $(".content").val("")
            return
        }

        $("tbody").append('<tr>'+
            '<td index="'+(flag++)+'">' + text + '</td>'+
            ' <td>'+
            '<input type="button" value="完成" class="finish">'+
            '<input type="button" value="删除" class="delete">'+
            '<input type="button" value="修改" class="update">'+
            '</td>'+
            '</tr>')
        $(".content").val("")
    }else{
        alert("请输入内容")
    }
})

//finish
$("tbody").on("click",".finish",function(){
    
    var target =$(this).parent().prev()
    if($(this).val()=="恢复" ){
        $(this).val("完成").css({
            "color":"#910000",
            "border-color":"#910000"
        })
        target.css({
            "color":"#910000",
            "text-decoration":"none"
        })
    }else{
        $(this).val("恢复").css({
            "color":"#888",
            "border-color":"#888"
        } )
        target.css({
            "color":"#888",
            "text-decoration":"line-through"
        })
    }
})

//delete
$("tbody").on("click",".delete",function(){
    if(confirm("确定要删除吗？")){
        if($(this).prev().val()=="恢复"){
            $(this).parent().parent().remove()
        }else{
            alert("请继续努力吧")
        }
    }
   
})

//update
//回显
$("tbody").on("click",".update",function(){
    if($(this).prev().prev().val()=="完成"){
        var text=$(this).parent().prev().text()
        targetflag=$(this).parent().prev().attr("index")
        $(".content").val(text)
        $(".btn").val("修改")
    }else{
        alert("已经完成了，不必修改")
        $(".content").val("")
        $(".btn").val("添加")
    }




})