gpt4 book ai didi

javascript - jQuery从另一个div获取数据到li

转载 作者:行者123 更新时间:2023-11-28 09:57:03 25 4
gpt4 key购买 nike

我想使用 jQuery 进行此操作。在图像上单击该元素应添加到菜单中。假设我点击披萨图像,它应该在 ul 中添加新的 li,名称为披萨。当我再次点击图片 1 时,披萨应该不见了。这是代码:

<body>
<div class="foodcourt">
<div class="container">
<header>

</header>
<section class="maincircle">

<ul class="ch-grid">
<li>
<div class="ch-item">
<div class="ch-info">
<div class="ch-info-front ch-img-1"></div>
<div class="ch-info-back">
<h3>Pizza</h3>
<p>Price: ₹100</p>
</div>
</div>
</div>
</li>
</section>
<div class="menucard">
<ul id="list">
</ul>
</div>
</div>
</div>

最佳答案

工作 Fiddle

您的HTML:

<div class="foodcourt">
<div class="container">
<section class="maincircle">
<ul class="ch-grid">
<li>
<div class="ch-item">
<div class="ch-info">
<div class="ch-info-front ch-img-1">
<img src="http://www.belfast-takeaways.co.uk/img/pizza.jpg" />
</div>
<div class="ch-info-back">
<h3>Pizza</h3>

<p>Price: ₹100</p>
</div>
</div>
</div>
</li>
</ul>
</section>
<div class="menucard">
<ul id="list"></ul>
</div>
</div>
</div>

一些jQuery:

$(".ch-img-1").live("click", function () {
var newLi = $('.ch-info .ch-info-back h3').text();
if ($("#list li:contains(" + newLi + ")").length) {
$($("#list li:contains(" + newLi + ")")).remove();
} else {
$('.menucard #list').append('<li>' + newLi + '</li>');
}
});

瞧!

关于javascript - jQuery从另一个div获取数据到li,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24879730/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com