我想在onclick
jQuery中传递一个动态对象。请检查下面的代码片段,其中我将对象product
值作为undefined
获取。有人能帮我讲讲如何在JavaScript/jQuery中传递和接收对象值吗?
var hpc = "";
function handleProductsClick(e, product) {
debugger;
alert(product && JSON.stringify(product));
}
function buildProducts(products) {
var bp = '';
hpc = handleProductsClick.bind(products[i]);
for (var i = 0; i < products.length; i++) {
bp += '<li onclick="hpc(event)">' + products[i].value + '</li>';
}
$("#products").html(bp);
}
function getProductsFromApi() {
var products = [{
key: 1,
value: "Apple"
},
{
key: 2,
value: "Android"
}
];
buildProducts(products);
}
getProductsFromApi();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="products"></ul>
发布于 2018-05-28 18:52:05
最好避免使用内联onclick
,并尝试将事件附加到li
或公共类,n使用data-* attributes
来传递您想要的信息:
$(function() {
$('body').on('click', '.my_item', function() {
console.log($(this).data('product'));
});
});
function buildProducts(products) {
for (var i = 0; i < products.length; i++) {
$("#products").append("<li class='my_item' data-product='" + JSON.stringify(products[i]) + "'>" + products[i].value + "</li>");
}
}
function getProductsFromApi() {
var products = [{
key: 1,
value: "Apple"
},
{
key: 2,
value: "Android"
}
];
buildProducts(products);
}
getProductsFromApi();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="products"></ul>
发布于 2018-05-28 18:36:42
尝尝这个
var hpc = "";
function handleProductsClick(e, product) {
debugger;
alert(product && JSON.stringify(product));
}
function buildProducts(products) {
var bp = '';
hpc = handleProductsClick.bind(products[i]);
for (var i = 0; i < products.length; i++) {
bp += '<li onclick="hpc(event)">' + products[i].value + '</li>';
}
$("#products").html(bp);
}
function getProductsFromApi() {
var products = [{
key: 1,
value: "Apple"
},
{
key: 2,
value: "Android"
}
];
buildProducts(products);
}
getProductsFromApi();
https://stackoverflow.com/questions/50564186
复制相似问题