JQuery 从 Onther Div 获取数据到 Li

Question

我希望使用 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>

Answer 1

我想这会对你有所帮助..

http://jsfiddle.net/Praveen16oct90/YwRTU/

做你需要的..

$(document).ready(function()
  {
 var add=true;
  $('.ch-info-back').click(function()
 {

   var text=$(this).find('h3').html();
    if(add)
    {
         $('#list').append('<li>'+text+'</li>');
        add=false;
    }
     else
     {
          $('#list').empty();
          add=true;
     }
 });

});

Answer 2

工作小提琴

你的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>');
    }
});

瞧！

JQuery 从 Onther Div 获取数据到 Li

问题描述

2 个解决方案

解决方案1
0 2014-07-22 06:22:30

解决方案2
0 已采纳 2014-07-22 07:00:24

工作小提琴

JQuery 从 Onther Div 获取数据到 Li

问题描述

2 个解决方案

解决方案1 0 2014-07-22 06:22:30

解决方案2 0 已采纳 2014-07-22 07:00:24

工作小提琴

解决方案1
0 2014-07-22 06:22:30

解决方案2
0 已采纳 2014-07-22 07:00:24