首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在onclick - JavaScript/jQuery中传递动态对象

在onclick - JavaScript/jQuery中传递动态对象
EN

Stack Overflow用户
提问于 2018-05-28 18:22:10
回答 2查看 1.5K关注 0票数 1

我想在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>

EN

回答 2

Stack Overflow用户

发布于 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>

票数 1
EN

Stack Overflow用户

发布于 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();
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50564186

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档