如何获取li标签当中的data-id的值了？

Question

1. 当点击加入购物车或立即购买时获取到口味、包装的选中的data-id值了？

<div class="theme-options">

 <div class="cart-title">口味</div>

   <ul>                                               

    <li class="sku-line selected" id="taste" data-id="1">原味</li>

    <li class="sku-line" id="taste" data-id="2">黑糖</li>

   </ul>

 </div>

<div class="theme-options">

   <div class="cart-title">包装</div>

      <ul id="test">

       <li class="sku-line selected" data-id="1">单人份<i></i></li>

       <li class="sku-line" data-id="2">礼品包<i></i></li>

       </ul>

     </div>

     

<li>

   <div class="clearfix tb-btn tb-btn-buy theme-login">

     <a id="LikBuy" title="点此按钮到下一步确认购买信息" href="#">立即购买</a>

    </div>

</li>

   <li>

     <div class="clearfix tb-btn tb-btn-basket theme-login">

      <a id="LikBasket" title="加入购物车"><i></i>加入购物车</a>

       </div>

   </li>

现在只能获取口味的data-id，如何点击加入购物车获取到口味的data-id、包装的data-id的值

$('#LikBasket').on('click', function() {var id =  $('.sku-line.selected').data('id');console.log(id);
})

Answer 1

建议给不同类名：<div&nbsp;class="theme-options"> &nbsp;<div&nbsp;class="cart-title">口味</div> &nbsp;&nbsp;&nbsp;<ul>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="sku-line&nbsp;selected&nbsp;sel-flavor"&nbsp;data-id="1">原味</li> &nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="sku-line&nbsp;sel-flavor"&nbsp;&nbsp;data-id="2">黑糖</li> &nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="sku-line&nbsp;sel-flavor"&nbsp;&nbsp;data-id="3">蜂蜜</li> &nbsp;&nbsp;&nbsp;</ul> &nbsp;</div><div&nbsp;class="theme-options"> &nbsp;&nbsp;&nbsp;<div&nbsp;class="cart-title">包装</div> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<ul&nbsp;id="test"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="sku-line&nbsp;selected&nbsp;sel-pack"&nbsp;data-id="1">单人份<i></i></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="sku-line&nbsp;sel-pack"&nbsp;data-id="2">礼品包<i></i></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="sku-line&nbsp;sel-pack"&nbsp;data-id="3">豪华包装<i></i></li> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</ul> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>然后在点击“加入购物车”按钮的时候：$("#LikBasket").click(function(){&nbsp;&nbsp;&nbsp;console.log($(".sel-flavor.selected").data("id"))//获取选择的口味data-id &nbsp;&nbsp;&nbsp;console.log($(".sel-pack.selected").data("id"))//获取选择的包装data-id})补充一下，在同一个页面，id不要重复。id="taste"&nbsp;//我看你这个三个li都是同一个id，其实完全没必要给id

Answer 2

如果有引用 jQuery 的话：$('.sku-line').on('click',&nbsp;function()&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;id&nbsp;=&nbsp;$(this).data('id');&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;console.log(id); })