0

我想创建需要呈现为下面给出的代码的动态 html：

<a rel="{gallery: 'gal', smallimage: 'a',largeimage: 'b'}" href="javascript:void(0);"><img src="x1.jpg"></a>

我在 jQuery 中编写了以下代码以实现上述目标：

for(i=1; i<=4; i++){
    var rela="{gallery:'gal', smallimage:'a', largeimage: 'b'}";
    html += "<a href='javascript:void(0);' rel='"+rela+"' ><img src='x"+i+".jpg' /></a>";
}

但是当它被执行时，它呈现如下：

<a 'b'}'="" largeimage:="" smallimage:'a',="" gal',="" rel="{gallery:" href="javascript:void(0);"><img src="x1" class="img1"></a>
4

2 回答 2

2

正如您自己发现的那样，使用属性在对象上存储数据并不是一个聪明的主意，它不像您希望的那样工作。特别是json。

在您的情况下，您正在尝试存储 json？或者在 html 中包含 qoute 的对象，但是浏览器会将它遇到的第一个 qoute 视为 rel 属性的闭包。

将不同的属性存储在单独的数据属性中，或者考虑将项目存储在 js 变量中，并将锚点存储在 id 中。当您再次需要数据时，您可以使用锚点上的 id 从 js 变量中重新捕获数据。（在此处阅读有关数据属性的更多信息）。

于 2011-09-19T18:52:38.130 回答
0 
html += "<a href='javascript:void(0);' rel=\""+rela+"\" ><img src='x"+i+".jpg' /></a>";

或者

var rela='{gallery:"gal", smallimage:"a", largeimage: "b"}';
于 2011-09-19T18:52:04.413 回答