对象不支持IE9中的属性或方法'append'

时间:2013-03-14 09:48:33

标签: javascript jquery internet-explorer-9

这个脚本在firefox或chrome中工作,但只能在IE9的一半处获得,IE9是我们网站的顶级浏览器。

我遇到的问题是抛出这个错误。

SCRIPT438:对象不支持属性或方法'append' calc_ajax.js,第26行21字符

在这一行:item.append(link);

并且我坚持了原因。任何帮助,将不胜感激。

$(document).ready(function(){
$('.first a.btn').click(function(){
    $('.first a.active').removeClass('active');
    $(this).addClass('active');
    $('.second .title').addClass('active');

    var id = $(this).data('cat-id');

    var wrap = $('<div>');

    $.ajax({
        url:    script_url,
        type:   "post",
        data: {"cat": id},
        dataType: "json"
    }).success(function(result){
        if(result.status == "ok"){
            $.each(result.data, function(i, elem){
                item = $("<div class='body-area'>").append($("<img src='" + elem.image + "'>"));
                link = $("<a href='#results' class='btn'>");
                link.text(elem.name);
                link.data('subcat-id', elem.id);
                item.append(link);

                wrap.append(item);

            });
            $('.second .body').html(wrap).slideDown('fast');
        }
    });
});

$('.second a.btn').live('click', function(){
    $('.second .body-area.active').removeClass('active');
    $(this).parent().addClass('active');

    var sub_id = $(this).data('subcat-id');        

    $.ajax({
        url:    script_url,
        type:   "post",
        data: {"subcat": sub_id},
        dataType: "json"
    }).success(function(result){
        if(result.status == "ok"){
            $('.third .title').text(result.data.title);
            $('.third .body').html(result.data.body);
            $('.third').slideDown('fast'); 
        }
    });        
});

});

3 个答案:

答案 0 :(得分:10)

window.item是Internet Explorer中的一种特殊方法,因为您粘贴的代码未声明本地变量item,它试图在IE中重新分配本机方法。 IE不允许重新分配,因此您没有真正获得item变量中您期望的jQuery对象,因此append方法不可用。

修复代码的最简单方法是在使用var变量之前添加item。我把一个jsFiddle放在一起,展示它如何修复IE http://jsfiddle.net/httyY/

中的问题
$.ajax({
    url:    script_url,
    type:   "post",
    data: {"cat": id},
    dataType: "json"
}).success(function(result){
    if(result.status == "ok"){
        $.each(result.data, function(i, elem){
            var item = $("<div class='body-area'>").append($("<img src='" + elem.image + "'>"));
            var link = $("<a href='#results' class='btn'>");
            link.text(elem.name);
            link.data('subcat-id', elem.id);
            item.append(link);

            wrap.append(item);

        });
        $('.second .body').html(wrap).slideDown('fast');
    }
});

答案 1 :(得分:3)

使用本机函数document.body.append时,我在IE11上遇到相同的错误。

我花了一段时间才意识到该功能实际上并不存在,尽管它在所有其他浏览器中都可以使用。应该为document.body.appendChild,在IE11中可以正常工作。

答案 2 :(得分:1)

尝试:

$.each(result.data, function(i, elem){
   var item = $("<div class='body-area'>").append($("<img src='" + elem.image + "'>"));
   var link = $("<a />", {"href" :"#results", "class": "btn"});
   link.text(elem.name);
   link.data('subcat-id', elem.id);
   item.append(link);
   wrap.append(item);    
});