我正在使用以下代码来创建带有信息字符串的不同部分,并且这些部分将显示在我的屏幕上。现在,我想在每个使用数据详细信息的部分中添加一个按钮,以在按钮中存储名称和价格。我尝试通过使用数据详细信息在字符串中添加一个按钮,但是由于必须使用不同的“”和“”而使字符串不完整,并且无法完成代码。
function display(results) {
article = document.getElementById("homeArticle");
var html = '';
for (var i = 0; i < results.length; i++){
var item = results[i];
var name = item.P_NAME;
var description = item.P_DESCRIPTION;
var price = item.P_PRICE;
var quant = item.P_QUANTITY;
// next I add to the string that we want to place on the page
html += '<section id="homePageSection"> <p>Name: ' + name + '</p><p>Description: ' + description + '</p><p>Price: £' + price + '</p><p>Quantity: ' + quant + '</p></section>';
var button = document.createElement("button");
button.dataset.detail = JSON.stringify(name);
button.innerHTML = "Add To Basket"
var section = document.getElementById("homePageSection");
};
article.innerHTML = html;
}
function getItems() {
var xhr = new XMLHttpRequest();
xhr.onload = function() {
var results = JSON.parse(this.responseText);
display(results.rows);
};
xhr.open("GET", "displayData.php");
xhr.send();
}
window.addEventListener("load", getItems);
在查看类似问题的其他答案之后,我尝试使用以下代码:
var button = document.createElement("button");
button.dataset.detail = JSON.stringify(name);
button.innerHTML = "Add To Basket"
var section = document.getElementById("homePageSection");
但是,我不太了解它是如何工作的,需要向正确的方向指出帮助,还是可以只使用数据详细信息来完成它,还是需要使用document.createElement
和appendChild
代码?
html页面是:
<body>
<article id="homeArticle">
</article>
<script src="homeDisplay.js"></script>
</body>
多数民众赞成在例子:https://jsfiddle.net/03jqfx6g/
多数民众赞成岁:
var button = document.createElement("button");
button.dataset.detail = JSON.stringify(name);
button.innerHTML = "Add To Basket"
document.getElementById("homePageSection").appendChild(btn);
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句