如何刪除重複的選定項目並用數量替換

我一直在爲這個項目進行學校工作。這是K-J等級的供應清單。每個年級都有＃2鉛筆和各種其他類似的項目。當您在幼兒園（＃2鉛筆）中選擇一個項目並在第五年級選擇相同的項目時，則生成列表我不需要＃2鉛筆顯示兩次，但只顯示一次，旁邊有數量編號。如何刪除重複的選定項目並用數量替換

我相信它與if語句有關，但我仍然試圖掌握這些。

這裏是jQuery Mobile的部分

<body> 
<section class="header_default footer_default" data-role="page" id="setup" data-title="Setup"> 
<article data-role="content"> 
    <div class="loaded"></div> 
    <p id="count"></p> 
    <form> 
<fieldset data-role="controlgroup" id="hoursName"> 
      <legend><strong>Kindergarten Supply List:</strong></legend> 
      <input type="checkbox" class="checkbox-group" name="checkboxsupply" id="1" value="(48 Quanity) #2 6-sided pencils (sharpened preferred)" > 
      <label for="1">(48 Quanity) #2 6-sided pencils (sharpened preferred)</label> 
      <input type="checkbox" class="checkbox-group" name="checkboxsupply" id="2" value="(2 Quanity) Red pencils"> 
      <label for="2">(2 Quanity) Red Pencils</label> 
      <input type="checkbox" class="checkbox-group" name="checkboxsupply" id="3" value="(1 Quanity) Pack of pink erasers"> 
      <label for="3">(1 Quanity) Pack of pink erasers</label> 
      <input type="checkbox" class="checkbox-group" name="checkboxsupply" id="4" value="(1 Quanity) Box of Kleenex (tissue)"> 
      <label for="4">(1 Quanity) Box of Kleenex (tissue)</label> 
      <input type="checkbox" class="checkbox-group" name="checkboxsupply" id="5" value="(1 Quanity) Pack of pencil cap erasers"> 
      <label for="5">(1 Quanity) Pack of pencil cap erasers</label> 
     </fieldset> 
     <fieldset data-role="controlgroup" id="hoursName"> 
      <legend><strong>First Grade Supply List:</strong></legend> 
      <input type="checkbox" name="checkboxsupply" id="1" value="(48 Quanity) #2 6-sided pencils (sharpened preferred)" > 
      <label for="1">(48 Quanity) #2 6-sided pencils (sharpened preferred)</label> 
      <input type="checkbox" name="checkboxsupply" id="2" value="(2 Quanity) Red pencils"> 
      <label for="2">(2 Quanity) Red Pencils</label> 
      <input type="checkbox" name="checkboxsupply" id="3" value="(1 Quanity) Pack of pink erasers"> 
      <label for="3">(1 Quanity) Pack of pink erasers</label> 
      <input type="checkbox" name="checkboxsupply" id="4" value="(1 Quanity) Box of Kleenex (tissue)"> 
      <label for="4">(1 Quanity) Box of Kleenex (tissue)</label> 
      <input type="checkbox" name="checkboxsupply" id="5" value="(1 Quanity) Pack of pencil cap erasers"> 
      <label for="5">(1 Quanity) Pack of pencil cap erasers</label> 
     </fieldset> 
     <fieldset data-role="controlgroup" id="hoursName"> 
      <legend><strong>Second Grade Supply List:</strong></legend> 
      <input type="checkbox" name="checkboxsupply" id="1" value="(48 Quanity) #2 6-sided pencils (sharpened preferred)" > 
      <label for="1">(48 Quanity) #2 6-sided pencils (sharpened preferred)</label> 
      <input type="checkbox" name="checkboxsupply" id="2" value="(2 Quanity) Red pencils"> 
      <label for="2">(2 Quanity) Red Pencils</label> 
      <input type="checkbox" name="checkboxsupply" id="3" value="(1 Quanity) Pack of pink erasers"> 
      <label for="3">(1 Quanity) Pack of pink erasers</label> 
      <input type="checkbox" name="checkboxsupply" id="4" value="(1 Quanity) Box of Kleenex (tissue)"> 
      <label for="4">(1 Quanity) Box of Kleenex (tissue)</label> 
      <input type="checkbox" name="checkboxsupply" id="5" value="(1 Quanity) Pack of pencil cap erasers"> 
      <label for="5">(1 Quanity) Pack of pencil cap erasers</label> 
     </fieldset> 
     <fieldset data-role="controlgroup" id="hoursName"> 
      <legend><strong>Third Grade Supply List:</strong></legend> 
      <input type="checkbox" name="checkboxsupply" id="1" value="(48 Quanity) #2 6-sided pencils (sharpened preferred)" > 
      <label for="1">(48 Quanity) #2 6-sided pencils (sharpened preferred)</label> 
      <input type="checkbox" name="checkboxsupply" id="2" value="(2 Quanity) Red pencils"> 
      <label for="2">(2 Quanity) Red Pencils</label> 
      <input type="checkbox" name="checkboxsupply" id="3" value="(1 Quanity) Pack of pink erasers"> 
      <label for="3">(1 Quanity) Pack of pink erasers</label> 
      <input type="checkbox" name="checkboxsupply" id="4" value="(1 Quanity) Box of Kleenex (tissue)"> 
      <label for="4">(1 Quanity) Box of Kleenex (tissue)</label> 
      <input type="checkbox" name="checkboxsupply" id="5" value="(1 Quanity) Pack of pencil cap erasers"> 
      <label for="5">(1 Quanity) Pack of pencil cap erasers</label> 
     </fieldset> 
     <fieldset data-role="controlgroup" id="hoursName"> 
      <legend><strong>Forth Grade Supply List:</strong></legend> 
      <input type="checkbox" name="checkboxsupply" id="1" value="(48 Quanity) #2 6-sided pencils (sharpened preferred)" > 
      <label for="1">(48 Quanity) #2 6-sided pencils (sharpened preferred)</label> 
      <input type="checkbox" name="checkboxsupply" id="2" value="(2 Quanity) Red pencils"> 
      <label for="2">(2 Quanity) Red Pencils</label> 
      <input type="checkbox" name="checkboxsupply" id="3" value="(1 Quanity) Pack of pink erasers"> 
      <label for="3">(1 Quanity) Pack of pink erasers</label> 
      <input type="checkbox" name="checkboxsupply" id="4" value="(1 Quanity) Box of Kleenex (tissue)"> 
      <label for="4">(1 Quanity) Box of Kleenex (tissue)</label> 
      <input type="checkbox" name="checkboxsupply" id="5" value="(1 Quanity) Pack of pencil cap erasers"> 
      <label for="5">(1 Quanity) Pack of pencil cap erasers</label> 
     </fieldset> 
     <fieldset data-role="controlgroup" id="hoursName"> 
      <legend><strong>Fifth Grade Supply List:</strong></legend> 
      <input type="checkbox" name="checkboxsupply" id="1" value="(48 Quanity) #2 6-sided pencils (sharpened preferred)" > 
      <label for="1">(48 Quanity) #2 6-sided pencils (sharpened preferred)</label> 
      <input type="checkbox" name="checkboxsupply" id="2" value="(2 Quanity) Red pencils"> 
      <label for="2">(2 Quanity) Red Pencils</label> 
      <input type="checkbox" name="checkboxsupply" id="3" value="(1 Quanity) Pack of pink erasers"> 
      <label for="3">(1 Quanity) Pack of pink erasers</label> 
      <input type="checkbox" name="checkboxsupply" id="4" value="(1 Quanity) Box of Kleenex (tissue)"> 
      <label for="4">(1 Quanity) Box of Kleenex (tissue)</label> 
      <input type="checkbox" name="checkboxsupply" id="5" value="(1 Quanity) Pack of pencil cap erasers"> 
      <label for="5">(1 Quanity) Pack of pencil cap erasers</label> 
     </fieldset> 
     <fieldset data-role="controlgroup" id="hoursName"> 
      <legend><strong>Sixth Grade Supply List:</strong></legend> 
      <input type="checkbox" name="checkboxsupply" id="1" value="(48 Quanity) #2 6-sided pencils (sharpened preferred)" > 
      <label for="1">(48 Quanity) #2 6-sided pencils (sharpened preferred)</label> 
      <input type="checkbox" name="checkboxsupply" id="2" value="(2 Quanity) Red pencils"> 
      <label for="2">(2 Quanity) Red Pencils</label> 
      <input type="checkbox" name="checkboxsupply" id="3" value="(1 Quanity) Pack of pink erasers"> 
      <label for="3">(1 Quanity) Pack of pink erasers</label> 
      <input type="checkbox" name="checkboxsupply" id="4" value="(1 Quanity) Box of Kleenex (tissue)"> 
      <label for="4">(1 Quanity) Box of Kleenex (tissue)</label> 
      <input type="checkbox" name="checkboxsupply" id="5" value="(1 Quanity) Pack of pencil cap erasers"> 
      <label for="5">(1 Quanity) Pack of pencil cap erasers</label> 
     </fieldset> 
    </form> 
    <button class="ui-btn ui-corner-all Create">Create List</button> 


</article><!--content--> 
</section>

這裏是我有

<div data-role="page" id="nameList"></div> 
<script id="jsbin-javascript"> 
$(".Create").on("click", function() { 
    var selectedValues = ""; 
    $checkedCheckboxes = $("input:checkbox[name=checkboxsupply]:checked"); 
    $checkedCheckboxes.each(function() { 
     $('#nameList').append('<li>' + $(this).val() + '</li>'); 
    }); 
    window.location = "#nameList"; 
}); 
</script>

的JavaScript任何建議將是巨大的，我已經使用jQuery的方式來計數的數量嘗試但沒有運氣。

再次感謝。

來源

2015-03-24 RealMcCoy

假如你不能改變任何標記，這裏你可以這樣做:)有點哈克的方式

$(".Create").on("click", function() { 
    var valuesToListItemMap = {}; 
    $('#nameList').text(""); 

    $checkedCheckboxes = $("input:checkbox[name=checkboxsupply]:checked"); 
    $checkedCheckboxes.each(function() { 
     var value = $(this).val(); 
     var element; 

     if (valuesToListItemMap[value]) { 
     element = valuesToListItemMap[value]; 

     var newCount = parseInt(element.data('count')) + 1; 

     element.data('count', newCount); 
     element.text(value + ' ' + newCount + ' were selected'); 
     } else { 
     element = $('<li>' + value + '</li>'); 
     element.data('count', 1); 

     $('#nameList').append(element); 

     valuesToListItemMap[value] = element; 
     } 
    }); 

    window.location = "#nameList"; 
    });

演示：http://jsbin.com/yanaju/4/edit

來源

2015-03-24 21:54:05 brianvaughn

酷如何改變量在（），但我希望保持這些數字相同，因爲這樣可以保持簡單，尋找類似於某個項目的檢查數量。（48數量）＃2 6支鉛筆（首選銳化）3檢查 – RealMcCoy 2015-03-24 21:58:47

那麼這是一個簡單的調整，然後。 ;）我會更新我的描述... – brianvaughn 2015-03-24 21:59:33

我明白，我接近獲得數量，但我無法刪除重複。再次感謝 – RealMcCoy 2015-03-24 22:02:23

如何刪除重複的選定項目並用數量替換

回答

相關問題