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的价值观不确定的

回答

相关问题