我使用“for 循环”多次调用 getjson 并获得响应,并希望在 div 中显示特价商品。目前我的代码在每个框架的右侧显示元素名称,但我想在 iframe 下方显示元素名称,就像下面的代码块一样:
想要输出而不是我的代码当前输出但不知道如何输出的示例 div 元素:
<li>
<iframe src='http://bsite.com/itemshow.php?pen' height=200 width=200 style='border: none;'></iframe><br>
<div class="details">
<div class="title">
<a href="/pen/">pen</a>
</div>
</div>
</li>
你们能告诉我如何在每个潜水元素下面添加元素名称(就像上面的代码块一样)并将 div 的数量限制为每行 5 个吗?
当前显示div的部分代码:
var siteContents2 = "<iframe src='http://bsite.com/itemshow.php?"+itemName' height=200 width=200 style='border: none;'></iframe>"+itemName;
document.getElementById("myDiv").innerHTML += siteContents2;
完整代码:
function GetJSONResult(itemName)
{
$.getJSON('http://anyorigin.com/get?url=http://asite.com/checkit.php'+ itemName + '/&callback=?', function(data){
var siteContents = data.contents;
//writes to textarea
document.myform.outputtext.value = siteContents ;
var n=siteContents.search("This item is not on sale");
if(n===-1)
{
//alert("This item is on sale. n:"+n);
var siteContents2 = "<iframe src='http://bsite.com/itemshow.php?"+itemName' height=200 width=200 style='border: none;'></iframe>"+itemName;
document.getElementById("myDiv").innerHTML += siteContents2;
};
});
};
items=["pen","book","paper","ink","tshirt","map"];
for (var i=0;i<items.length;i++)
{
//document.write(i+")"+items[i] + "<br>");
GetJSONResult(items[i]);
}
</script>
</head>
<body>
<div id="myDiv"></div>
最佳答案
要用更复杂的 html 替换您的 iframe,我认为您只需要扩展您的字符串
var siteContents2 = "<li>"
+"<iframe src='http://bsite.com/itemshow.php?"+itemName+"' height=200 width=200 style='border: none;'></iframe><br>"
+"<div class='details'>"
+"<div class='title'>"
+"<a href='/"+itemName+"/'>"+itemName+"</a>"
+"</div></div></li>";
然后像您所做的那样将这些内容附加到 myDiv,但我建议您使用 jquery 这样做,因为您已经在使用它了
$("#myDiv").append(siteContents2);
此外,您的 myDiv 可能应该是一个 UL 或 OL 列表,而不是一个 DIV,因为您想要向其附加列表项。
要让您的 li 元素每行显示 5 个元素,您可以为它们应用适当的 css 样式,例如让它们 float :左,并设置父级 ul 宽度以适合 5 个元素(这样接下来的 5 个将转到下一个行),看这个简单的演示 http://jsfiddle.net/paulitto/Qnbk4/
#myDiv{
width:500px;
}
#myDiv li{
float:left;
width:100px;
}
当然你需要调整这个以适应你的代码
关于javascript - 如何为每个div项添加标题名称并连续显示5个div项?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16475006/