Javascript 将url传递给动态div

因此，我创建了一个带有动态div的图像库，并希望将onclick事件添加到div中，但我得到一个错误“ReferenceError:pag1未定义”我做错了什么。下面是我的代码

var btnInfo=[
    {
        img: 'images/thumbs/img1.jpg',
        id: 'btn1',
        title: 'Kingsman',
        projectUrl: 'pag1.html'
    },
    {
        img: 'images/thumbs/img2.jpg',
        id: 'btn2',
        title: 'Title Two',
        projectUrl: 'page2.html'
    }
]

for(var i=0; i<btnInfo.length; i++){
  $('.thumbWrapper .container ul' ).append('<li id="'+btnInfo[i].id+' "    onclick="getProject('+btnInfo[i].projectUrl+' )"><div class="view view-tenth"><img src="'+btnInfo[i].img+'"><div class="mask"><h2>'+btnInfo[i].title+'</h2></div></div></li>');
}

function getProject(url){
        var w = url;
        console.log("url " + url);
}

var btnInfo=[
{
img:'images/thumbs/img1.jpg'，
id:'btn1'，
标题：“国王”，
projectUrl:'pag1.html'
},
{
img:'images/thumbs/img2.jpg'，
id:'btn2'，
标题：“标题二”，
projectUrl:'page2.html'
}
]
对于（var i=0；i您在
onclick
处理程序中输出的参数，不带引号，应该是

... onclick="getProject(\''+btnInfo[i].projectUrl+'\' )"><div class="view view-tenth">
//                       ^^                        ^^ needs escaped quotes

…onclick=“getProject（\'+btnInfo[i].projectUrl+'\'）”>
//^^^^^需要转义引号

但是为什么不直接使用jQuery呢

$('.thumbWrapper .container ul' ).append(
    btnInfo.map(function(item) {
        return $('<li />', {
            id : item.id,
            on : {
                click : function() {
                    getProject(item.projectUrl)
                }
            }
        }).append(
            $('<div />', {'class' : 'view view-tenth'}),
            $('<img />', {src : item.img}),
            $('<div />', {'class' : 'mask'}).append(
                 $('<h2 />', {text : item.title})
            )
        )
    })
)

$（'.thumbWrapper.container ul'）。追加(
btnInfo.map（功能（项）{
返回$（“
”{
id:item.id，
关于：{
单击：函数（）{
getProject（item.projectUrl）
}
}
}).附加(
$（''，{'class'：'view-view-tenth'}），
$（“”，{class'：'mask'}）。追加(
$（''，{text:item.title}）
)
)
})
)

您在
onclick
处理程序中输出的参数不带引号，应该是

... onclick="getProject(\''+btnInfo[i].projectUrl+'\' )"><div class="view view-tenth">
//                       ^^                        ^^ needs escaped quotes

…onclick=“getProject（\'+btnInfo[i].projectUrl+'\'）”>
//^^^^^需要转义引号

但是为什么不直接使用jQuery呢

$('.thumbWrapper .container ul' ).append(
    btnInfo.map(function(item) {
        return $('<li />', {
            id : item.id,
            on : {
                click : function() {
                    getProject(item.projectUrl)
                }
            }
        }).append(
            $('<div />', {'class' : 'view view-tenth'}),
            $('<img />', {src : item.img}),
            $('<div />', {'class' : 'mask'}).append(
                 $('<h2 />', {text : item.title})
            )
        )
    })
)

$（'.thumbWrapper.container ul'）。追加(
btnInfo.map（功能（项）{
返回$（“
”{
id:item.id，
关于：{
单击：函数（）{
getProject（item.projectUrl）
}
}
}).附加(
$（''，{'class'：'view-view-tenth'}），
$（“”，{class'：'mask'}）。追加(
$（''，{text:item.title}）
)
)
})
)

你可能是指
page1.html
也就是说，在你的第一个对象中，在你的“projectUrl”属性中，你可能是指
page1.html
也就是说，在你的第一个对象中，在你的“projectUrl”属性中，它不应该有双引号吗？就像这样：
onclick=“getProject（“+btnInfo[i].projectUrl+”）”>@EisaAdil-这将产生
onclick=“getProject”（'pag1.html”）”
，这似乎相当无效。我不这么认为
onclick=“getProject（'pag1.html'）”
是它应该产生的，作为一个整体，它应该是这样：
onclick=“getProject（'+btnInfo[i].projectUrl+”）>让我们来看看。相反，它不应该有双引号吗？像这样：
onclick=“getProject”（“+btnInfo[i].projectUrl+”）”>@EisaAdil-这会产生
onclick=“getProject”（“pag1.html”）”
这似乎很无效，我不这么认为
onclick=“getProject”（“pag1.html”）“
是它应该生产的东西，作为一个整体，它应该是这样：
onclick=“getProject（”+btnInfo[i].projectUrl+”）>让我们来看看。