Question

当我点击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(){ }));
    });
});

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

Answer 1

试试这个：

$(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。我分解了一些代码以提高可读性。

Answer 2

我对您的代码进行了一些更改：

http://jsfiddle.net/T5r6D/

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

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

请记住，图像不会显示，因为它不在jsfiddle服务器上。尝试一下。

<强>更新

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

因此新更新不会隐藏整个容器。

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

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

2 个答案: