jquery在appendTo的字符串中使用变量

时间:2010-09-28 17:20:52

标签: jquery variables appendto

如何将此URL变量附加到列表中?

我正在摆弄这个:http://jsfiddle.net/Y2ER7/4/

JS:

$(function() {
    var pic = "http://jqueryui.com/demos/droppable/images/high_tatras3_min.jpg";

    // doesn't work
    $("<li><img /></li>").attr("src", pic).appendTo("#album ul");
    $("<li><img src='pic' /></li>").appendTo("#album ul");

    // hardcoded works
    $("<li><img src='http://jqueryui.com/demos/droppable/images/high_tatras3_min.jpg' /></li>").appendTo("#album ul");
});

HTML:

<div id="album">
    <ul>
        <li>red</li>
        <li>green</li>
        <li>blue</li>
    </ul>
</div>

2 个答案:

答案 0 :(得分:9)

您想在src上设置<img>,然后在<li></li>中设置.wrap(),如下所示:

$("<img />").attr("src", pic).wrap("<li />").parent().appendTo("#album ul");

You can test it out here,请务必使用.parent()<li>包裹起来。

答案 1 :(得分:0)

您可以执行以下操作:http://jsfiddle.net/Y2ER7/6/

$("<li />", {html:"<img src='" + pic + "' />"}).appendTo("#album ul");

创建一个新的<li>元素,其HTML内容设置为<img>pic属性连接src


编辑:如下面@Nick Craver的评论中所述,如果您不确定pic变量的来源,则不应连接src属性如此答案。

如果您在问题中使用字符串,则不应存在问题。