javascript - 如何通过单击其 div 从 p 获取文本？

Question

我想在 div 或 img 中单击并获取其中 p 的文本以进入另一个列表。

 <div onClick="add_basket(this);" class="menu-item burger"> <img  src="img\McDo\bigmac.png"> <p>Big Mac</p> </div>
  <div onClick="add_basket(this);" class="menu-item burger"> <img  src="img\McDo\doubleqp.png"> <p>Double Quarter Pounder</p> </div>


   <ul class="basket" id="basket-mcdo">
    <li>Order</li>
    <li>Mcdo</li>
  </ul>

我还有很多其他类似的函数，这是我的函数，但它不起作用，它添加了“未定义”是列表

function add_basket(that) {
    $(".basket").append("<li>"+that+"</li>");
}

非常感谢您的帮助:)

Answer 1

您使用处理程序 jQuery 发出请求
JS

$(".menu-item").click(function(){
   $(".basket").append("<li>"+$(this).children("p").text()+"</li>");
});

HTML

 <div class="menu-item burger"> <img  src="img\McDo\bigmac.png"> <p>Big Mac</p> </div>
  <div class="menu-item burger"> <img  src="img\McDo\doubleqp.png"> <p>Double Quarter Pounder</p> </div>

在这里你可以在这个jsFiddle中测试它