如何使用变量来显示某些内容？答案

【问题标题】：How to use variable to display certain content?如何使用变量来显示某些内容？
【发布时间】：2011-10-12 08:43:09
【问题描述】：

当我单击 href 时，我想显示来自目标 id 的图像和描述。有人可以为我更正此代码并告诉我如何正确操作吗？非常感谢！

HTML：

    <div id="gallery"><img/></div>
    <a href="#panorak">Click me</a>

jQuery 代码：

var datas={
            "images":[{ "src":"gallery/panorak.jpg",
                        "title":"PANORAK",
                        "date":"28/10/2010 Web Design",
                        "description":"desc",
                        "id":"panorak",
                        }, 
                        {
                        "src":"gallery/kamoa.jpg",
                        "title":"kamoa",
                        "date":"28/10/2010 Web Design",
                        "description":"desc",
                        "id":"kamoa",
                        }, 
                    ]};
$(document).ready(function(){
    var gallery=$("#gallery")

    //****I don't know how to display it right at this point

    var list=$("<ul/>");
    gallery.append(list);
    datas.images.each(function(i,j){
        list.prepend($("<li/>").$("<img/>").attr("src",datas.images[i].src).load(function(){ }));
    });
});

非常感谢任何帮助！非常感谢！

【问题讨论】：

你的问题不够清楚。现在，您的代码应该在页面加载时动态添加两个图像。您想更改它，使其仅在单击“点击我”链接时添加图像？
没错！另外我想知道如何将其他细节添加到前置部分。就像给 li 元素一个 id。提前感谢您的帮助。

标签： javascript jquery click gallery append

【解决方案1】：

我对你的代码做了一些修改：

http://jsfiddle.net/T5r6D/

查看我的 jsfiddle 链接以获取所有更新。您在流程问题和 javascript 错误中有一些结构。

我正在使用普通的 for 循环将所有图像添加到数组中。循环完成后，我用<li> 包装图像并将列表添加到舞台。

请记住，图像不会显示，因为它不在 jsfiddle 服务器上。试试在你身边。

更新

http://jsfiddle.net/T5r6D/1/

所以新的更新不会隐藏整个容器。

锚点#tag [href] 将与图像标题标签匹配。因此，一旦单击按钮，它将隐藏匹配的图像。

【讨论】：

这是我正在寻找的东西，问题是我只想取消隐藏其中一个图像，而不是整个包含 div。你能告诉我怎么做吗？
也许通过将 id 分配给 li 元素？或者有没有更有效的方法？谢谢！
不需要，我正忙着更新我的答案，使用#tag 隐藏图像:)

【解决方案2】：

试试这个：

$(document).ready(function(){
    var gallery=$("#gallery")

    //****I don't know how to display it right at this point    

    $('a').click(function(){
        var list=$("<ul/>");
        gallery.append(list);
        $.each(datas.images, function(i,j){
            var img = $("<img/>").attr("src",datas.images[i].src);
            list.prepend($("<li/>").append(img));
        });
    });
});

如果你想在点击某物时触发事件，你可以使用click()函数。我修复了each() 功能部分。检查此documentation。我拆分了一些代码以提高可读性。

【讨论】：