jQuery的價值觀不確定的

-2

<div class="row"> 
    <div class="col-xs-12 col-md-12"> 
     <p class="lead"> 
      $21.000 
     </p> 
    </div> 
    <div class="section col-xs-12 col-md-12" style="padding-bottom:20px;"> 
     <h6 class="title-attr"><small>Qty</small></h6> 
     <div> 
      <div class="btn-minus"><span class="glyphicon glyphicon-minus"></span></div> 
      <input value="2" class="inputid"/> 
      <div class="btn-plus"><span class="glyphicon glyphicon-plus"></span></div> 
     </div> 
    </div> 
    <div class="col-xs-12 col-md-12" > 
     <a class="btn btn-success small addToCart">Add to cart</a> 
    </div> 
</div>

當我嘗試使用jQuery我越來越不確定讓輸入字段的值。他的腳本片段是：

$(document).ready(function() { 
    $('.addToCart').click(function() { 
     var pos = $(this).parent().find('.inputid').val(); 
     alert(pos); 
    }); 
});

任何想法我在做什麼錯在這裏。該警報顯示未定義。感謝

來源

2017-04-04 Fahad

嘗試'.parent（）上一頁（「節」）發現'，問題是，你的'父（）'選擇div圍繞你的'add to cart'，然後你在裏面搜索，並且它不包含'.inputid' –

排序。感謝您的幫助 – Fahad

然後你.addToCart按鈕點擊，你抓緊父div，並嘗試找到.inputid這裏：

<div class="col-xs-12 col-md-12" > 
    <a class="btn btn-success small addToCart">Add to cart</a> 
</div>

沒有.inputid這裏，這就是爲什麼undefined是結果。

來源

2017-04-04 11:08:10 ZhukovRA

這不是一個答案。它只解釋了這個問題。 –

@RoryMcCrossan對問題的很好的解釋已經包含解決方案。 – ZhukovRA

問題是因爲.inputid是兄弟到parent()元素的孩子。爲了解決這個問題，你可以遍歷DOM來找到使用closest()的.row，然後從那裏找到find()。試試這個：（ 'inputid'）

$(document).ready(function() { 
 
    $('.addToCart').click(function() { 
 
    var pos = $(this).closest('.row').find('.inputid').val(); 
 
    console.log(pos); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row"> 
 
    <div class="col-xs-12 col-md-12"> 
 
    <p class="lead"> 
 
     $21.000 
 
    </p> 
 
    </div> 
 
    <div class="section col-xs-12 col-md-12" style="padding-bottom:20px;"> 
 
    <h6 class="title-attr"><small>Qty</small></h6> 
 
    <div> 
 
     <div class="btn-minus"><span class="glyphicon glyphicon-minus"></span></div> 
 
     <input value="2" class="inputid" /> 
 
     <div class="btn-plus"><span class="glyphicon glyphicon-plus"></span></div> 
 
    </div> 
 
    </div> 
 
    <div class="col-xs-12 col-md-12"> 
 
    <a class="btn btn-success small addToCart">Add to cart</a> 
 
    </div> 
 
</div>

來源

2017-04-04 11:10:44

jQuery的價值觀不確定的

回答

相關問題