javascript - 如何在单击按钮时获取动态呈现的项目内的文本?
问题描述
我在使用 jquery 通过 ajax 获取内容后显示内容,因此内容是动态的,
var i, j;
var product_names = [];
var product_image = [];
var product_rate = [];
var product_amount = [];
var product_category = [];
$.ajax({
url: BASE_URL + '/getOrgServices?orgId=' + orgId,
type: 'GET',
success: function(result) {
//console.log(result);
for (i in result) {
product_names[i] = result[i].name;
product_image[i] = result[i].imgurl;
product_rate[i] = result[i].rate;
product_amount[i] = result[i].amount;
product_category[i] = result[i].categories;
}
for(i in product_category){
var html = '<div class="prod-content"><ul id="products">';
html += '<li class="row product-listing">';
html += '<div class="product-img-container"><img class="product-img" src="' + product_image[i] + '"></div>';
html += '<div class="container product-listing-details"><h6 id="product-title">' + product_names[i] + '</h6><div id="product-description">' + product_amount[i] + '</div><br><div id="product-cost">' + product_rate[i] + '</div></div>';
html += '<div id="product-add">';
html += '<button class="add-button" type="button" role="button">ADD</button>';
html += '<span class="quantity"><input class="item-quantity" type="number" value="0" min="0" max="50" step="1"></span>';
html += '</div></li> </ul></div>'
//adding elements to all category
var id_str = '#' + new_id[0];
$(id_str).append(html);
}
}
现在在下面的函数中,我想一次访问一个 h6 product_name 的名称,所以有什么方法可以这样做,比如我可以选择
$(".add-button").click(function() {
//here i want to add items to cart on button click (means the button clicked its corresponding item should be added to cart )
});
是 html 代码的购物车部分
<div class="order">
<ul id="products">
<li>
//here i want to append the added item
</li>
</ul>
</div>
解决方案
要获得所有 h6,您可以在没有 jQuery 的情况下执行以下类似操作。
$(".add-button").click(function() {
console.log("click");
document.querySelectorAll("div.prod-content h6").forEach((function(elem) {
console.log(elem.innerText);
if (parseInt(elem.innerText) > 0) {
console.log(elem);
}
}));
});
推荐阅读
- flutter - '_route == ModalRoute.of(context)': 不正确
- python - 返回最常见的元素作为字符串而不是列表 python
- android - Android Studio Navigation:从上方菜单栏捕获导航返回事件
- python - 解析来自 JSON URL 的信息后,如何在 if-else 语句中不打印多次就结束 for 循环
- git - 如何使用 Jenkins 管道将代码合并回 Github
- reactjs - react-i18next / i18n 遵循什么语言代码的 ISO 标准?
- flutter - 将 GridView 添加到列表视图的末尾
- tensorflow - Keras 在 LSTM 中降低维度,不知道为什么
- python - 从 tensorflow 中保存在 csv 文件中的最大 epoch 恢复训练
- vue.js - 在NUXT的布局中选择UI模块