尝试使用jquery mobile创建产品列表

我需要做一个产品清单，并希望能够添加两个+-按钮直接在清单上独立的产品数量。这是代码

HTML

<ul data-role="listview">
   <li data-icon="false"><a href="">
       <img src="images/1.jpg" alt="" /> text, text</a>
           <div data-role="fieldcontain">
              <button class="plus" id="1" data-icon="plus" data-iconpos="notext">Plus</button>
              <button class="minus" data-icon="minus" data-iconpos="notext">Minus</button>
               <p class="p"><span class="number">0</span></p>
         </div>
   </li>
   <li data-icon="false"><a href="">
       <img src="images/1.jpg" alt="" />text, text</a>
           <div data-role="fieldcontain">
               <button class="plus" id="1" data-icon="plus" data-iconpos="notext">Plus</button>
               <button class="minus" data-icon="minus" data-iconpos="notext">Minus</button>
               <p class="p"><span class="number">0</span></p>
           </div>
     </li>
     <li data-icon="false"><a href="">
         <img src="images/1.jpg" alt="" />text, text</a>
             <div data-role="fieldcontain">
                <button class="plus" id="1" data-icon="plus" data-iconpos="notext">Plus</button>
                <button class="minus" data-icon="minus" data-iconpos="notext">Minus</button>
                <p class="p"><span class="number">0</span></p>
            </div>
     </li>
</ul>
<a href="#" data-role="button" data-inline="true">Order</a>
<a href="#home" data-role="button" data-inline="true">Home</a>

---

以下是您的更新代码。您只需要使用当前li的数字类获取span。因此，我使用jquery的最近函数来查找该按钮的父li并更新span.number，还需要获取span.number的当前值，因为它具有基于li项的特定值

var $number = 0;
$('.plus').click(function () {
    var $this = $(this);
    $number = parseInt($(this).closest('li').find('.number').text());
    $number++;
    $(this).closest('li').find('.number').text($number).css('color', '#97bf0d');
});

$('.minus').click(function () {
    $number = parseInt($(this).closest('li').find('.number').text());
    if ($number > 0) {
        $number--;
    }
    $(this).closest('li').find('.number').text($number);
});

---

首先选中此更新的

第一件事，从加号按钮中删除ID，或使其唯一。因为您没有在提供的javascript中使用它，所以我无法告诉您哪个更相关，但是您不应该有重复的ID

var $number = 0;
$('.plus').click(function () {
    var $this = $(this);
    $number = parseInt($(this).closest('li').find('.number').text());
    $number++;
    $(this).closest('li').find('.number').text($number).css('color', '#97bf0d');
});

$('.minus').click(function () {
    $number = parseInt($(this).closest('li').find('.number').text());
    if ($number > 0) {
        $number--;
    }
    $(this).closest('li').find('.number').text($number);
});