Question

我有一个带有链接的HTML：

<a id="myLink" href="/aa.html" title="New Bangoo" class="bangoo">Bangoo</a>

我包含一个包含以下行的js文件：

$("#myLink").live('click', function() { 
var typi = 'Ginga';       
    $("#typeList").append('<option>' + typi + '</option>');        
});

aa.html有：

<label for="typeList">Type</label>
<div>
   <select id="typeList"></select>
</div>

aa.html在彩盒上打开。一切都好，但我不能追加类型来选择列表。它完成打开时没有元素。它曾经工作，但现在不工作。可能是因为js文件尝试在html加载之前附加到列表？

有什么想法吗？

修改

当我这样做时，它有效：

$("#myLink").live('click', function() { 
alert('Wait Here!');
var typi = 'Ginga';       
    $("#typeList").append('<option>' + typi + '</option>');        
});

当我发出任何等待的警报时，此时它有足够的时间附加到选择列表。我怎么能确定外部链接已加载所以我可以开始追加？

PS：我的问题是我在点击myLink后尝试附加我加载的HTML元素。 aa.html在开头没有放在dom，我是从外部源加载的。

在屏幕上加载外部页面后，选择列表中没有元素。当我尝试从Firebug运行相同的代码时，它添加了选择列表和工作的选项。这意味着代码可以工作，但是有一个时间和异步问题，我想在它位于dom树之前将元素附加到选择列表。我应该等待加载它，然后运行我的代码。

Answer 1

try this
$("#myLink").live('click', function(e) {
e.preventDefault(); 
var typi = 'Ginga';       
    $("#typeList").append($('<option></option>').val(typi ).html(typi )) ;   

});

Answer 2

我解决了我的问题。 colorbox插件有一个函数onComplete所以我用这个函数确保页面加载。

Answer 3

试

$("#myLink").live('click', function(e) { 
e.preventDefault();
var typi = 'Ginga';       
    $("<option/>",{text:typi,value:typi}).appendTo("#typeList");        
});

DEMO

JQuery Colorbox Future Element Append

3 个答案: