Question

我正在使用jquery为我的网站添加一个quickmenue。我的源代码是这样的：

var span = $('body').append('<span id="quickmenu">');
       $('#quickmenu').css('position','fixed')
              .css('background-color','white')
              .css('border','4px solid black')
              .css('border-left','0px solid black')
              .css('top','15px')
              .css('left','0px')
              .css('font-family','Calibri')
              .css('font-size','14px')
              .css('line-height','0px')
              .css('color','#777777')
              .css('text-align','center');

我的问题是，在FF和Chrome中一切正常，但IE9没有向我显示任何内容。

所以我在访问上面的代码后尝试了一些警报（）：

alert('I run'); // I run
alert(span); // [object Object]
alert($("#quickmenu")); // [object Object] 
alert(span == $("#quickmenu")); // false

所以我好像被创造了，但没有显示出来？！

我真的不知道那里出了什么问题，....控制台在FF和IE9中没有显示错误

任何想法？！： - /

Answer 1

我认为代码运行得太早了。您需要将代码包装在文档就绪函数中：

jQuery(document).ready(function() {

//your code goes here

});

我实际上会将您的功能更改为以下内容：

 jQuery(document).ready(function(e) {   
    var span = $('<span id="quickmenu" >')
        .css({
            'position':'fixed',
             'background-color':'white',
             'border':'4px solid black',
             'border-left':'0px solid black',
             'top':'15px',
             'left':'0px',
             'font-family':'Calibri',
             'font-size':'14px',
             'line-height':'0px',
             'color':'#777777',
             'text-align':'center'
        })
        .appendTo($("body"));
});

Answer 2

正如Smoki在评论中指出的那样。

切换自：$("#target").append(my_dom_element);

至：my_dom_element.appendTo("#target");

似乎解决了这个问题。

我正在使用一个大型但没有脚本的元素，我从外部文件导入并提前转换为元素。然后追加会失败。切换到使用.appendTo()方法有效。因此，当我被要求附加复杂元素时，我会猜测.append()的IE代码会混淆。虽然它可以很容易地将它附加到它混淆了它。

（jQuery 1.8.2）

JavaScript（jquery）追加IE9的问题

2 个答案: