我想创建动态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>
答案 0 :(得分:2)
使用属性在对象上存储数据并不是一个明智的想法,就像你自己发现的那样,它并不像你想要的那样工作。特别是json。
在你的情况下,你正试图存储json?或者在html中有一个带有qoutes的对象,但是浏览器会将它遇到的第一个qoute视为rel属性的闭包。弄乱大量的东西。
将不同的属性存储在单独的数据属性中,或者将项目存储在js变量中,并将锚点存储为id。当您再次需要数据时,使用锚点上的id从js变量中重新获取数据。 (read more here on data attributes)。
答案 1 :(得分:0)
html += "<a href='javascript:void(0);' rel=\""+rela+"\" ><img src='x"+i+".jpg' /></a>";
或
var rela='{gallery:"gal", smallimage:"a", largeimage: "b"}';