[JavaScript知识库]前端HTML代码编写中出现错误和改错方法

近期开始进行前端代码编写本文将记录部分编写过程中出现问题和解决过程(本文动态更新):

1、TypeError: $(...).live is not a function

原因：jquery后续版本取消.live的相关代码，采用新版jquery（1.7)以后的找不到该函数

本人采用直接将live改成.on就消除错误：代码如下：

原出错代码：

$(".body_sanji_div_bor >li").live({
    mouseover: function () {
        var id = $(this).attr('id');
        var pid = $(this).attr('pid');
        /*↓↓触摸状态判断↓↓*/
        $(".body_sanji_div[pid='"+pid+"']").next().remove();
        var cahndu1 = titleLength(jinru_id);
        var cahndu2 = titleLength(id);
        if(cahndu1 > cahndu2){
            // 回退
            // console.log("回退");
            $(".body_sanji_div[pid='"+pid+"']").next().remove();
        }
        /* ↑↑触摸状态判断↑↑*/

        jinru_id = id;
        var ju_top = $(this).offset().top;
        ju_top = ju_top-60;
        var shifou_xiaji = 0;
        for (var i=0;i<menuJson.length;i++){
           if(menuJson[i]['pid'] == id){
               shifou_xiaji = 1;
           }
        }
        if(shifou_xiaji == 1){
            var pid = 0 ;
            for (var i=0;i<menuJson.length;i++){
                if(menuJson[i]['id'] == id){
                    pid = menuJson[i]['pid'];
                }
            }
            var bor_html = html_wuxian_bor(id,ju_top,'on');
            $(".body_sanji_div[pid='"+pid+"']").parent('.body_sanji').append(bor_html);
            for(var x in menuJson){
                if(menuJson[x]['pid'] == id){
                    var wuxian_data = html_wuixan_li(menuJson[x]['id'],menuJson[x]['pid'],menuJson[x]['name'],menuJson[x]['url']);
                    $(".body_sanji_div[pid='"+id+"']").children(".body_sanji_div_bor").append(wuxian_data);
                }
            }
        }
    },
    mouseout: function () {

    }
});

错误如下图：

修改后的代码只在第一行修改live->on:

$(".body_sanji_div_bor >li").on({
    mouseover: function () {
        var id = $(this).attr('id');
        var pid = $(this).attr('pid');
        /*↓↓触摸状态判断↓↓*/
        $(".body_sanji_div[pid='"+pid+"']").next().remove();
        var cahndu1 = titleLength(jinru_id);
        var cahndu2 = titleLength(id);
        if(cahndu1 > cahndu2){
            // 回退
            // console.log("回退");
            $(".body_sanji_div[pid='"+pid+"']").next().remove();
        }
        /* ↑↑触摸状态判断↑↑*/

        jinru_id = id;
        var ju_top = $(this).offset().top;
        ju_top = ju_top-60;
        var shifou_xiaji = 0;
        for (var i=0;i<menuJson.length;i++){
           if(menuJson[i]['pid'] == id){
               shifou_xiaji = 1;
           }
        }
        if(shifou_xiaji == 1){
            var pid = 0 ;
            for (var i=0;i<menuJson.length;i++){
                if(menuJson[i]['id'] == id){
                    pid = menuJson[i]['pid'];
                }
            }
            var bor_html = html_wuxian_bor(id,ju_top,'on');
            $(".body_sanji_div[pid='"+pid+"']").parent('.body_sanji').append(bor_html);
            for(var x in menuJson){
                if(menuJson[x]['pid'] == id){
                    var wuxian_data = html_wuixan_li(menuJson[x]['id'],menuJson[x]['pid'],menuJson[x]['name'],menuJson[x]['url']);
                    $(".body_sanji_div[pid='"+id+"']").children(".body_sanji_div_bor").append(wuxian_data);
                }
            }
        }
    },
    mouseout: function () {

    }
});

结果：错误消除如图：