在无序列表中附加/删除复选框的值

时间:2014-04-11 07:36:29

标签: jquery html checkbox append

我正在使用jquery将复选框的值附加到无序列表中。我无法解决的是如何仅使用li作为可点击链接而不是取消选中复选框,从而再次从列表中删除项目(切换)。

HTML:

 <div id="addedtolist">
 <ul class='summary'>
 <li class="pink">Summary</li>
 <?php 
 $totalprice = 0;
 $totalprice = $ingredient['price'] + $totalprice;

 if (is_array($_SESSION['ingredients'])){
     foreach ($_SESSION['ingredients'] as $ingredient) {?>
     <li><span class="truncate"><?php echo $ingredient['name'] ;?></span>
      <strong>£<?php echo $ingredient['price'] ;?></strong></li>
     <?php  $totalprice = $ingredient['price'] + $totalprice;

      }

     }
      echo "</ul>
      </div>";
   echo "<p class='total'><strong>Subtotal: £ $totalprice</strong>";
     ?>  
 </ul>

Jquery的

$(document).ready(
function(){
    $('.chkbox').change(
        function(){
            if ($(this).is(':checked')) {
             text = $(this).val();
             price = $(this).data('price');
             $('<li />').appendTo('#addedtolist ul').text($(this).val());
              else {
               $('li a').click(function() {
               $('ul.summary a').remove();
               return false;
                });
}

              $.ajax({
                type: 'POST',
                url: 'ajax.php',
                data: {'name': text,'price':price },
                success: function(msg) {

                    }
                });  
            }
        }); 
});

任何帮助将不胜感激, 谢谢, 梅尔

1 个答案:

答案 0 :(得分:0)

if条件结束时你遗失}

$(document).ready(
function(){
    $('.chkbox').change(
        function(){
            if ($(this).is(':checked')) {
             text = $(this).val();
             price = $(this).data('price');
             $('<li />').appendTo('#addedtolist ul').text($(this).val());
            } // You were missed here.........................
              else {
               $('li a').click(function() {
               $('ul.summary a').remove();
               return false;
                });
}

              $.ajax({
                type: 'POST',
                url: 'ajax.php',
                data: {'name': text,'price':price },
                success: function(msg) {

                    }
                });  
            }
        }); 
});