使用jquery捕获跨度值

时间:2016-09-28 06:32:32

标签: javascript jquery

Hello Everyone我想用jquery从这个跨度中捕获价格我该如何实现这一点请提出建议

<span class="amount"><i class="fa fa-inr"></i>1,000</span>

下拉:

<li class="tmcp-field-wrap">
<label for="tmcp_select_1">Select</label>
            <select class="tmcp-field support-layer-firmness tm-epo-field tmcp-select tm-valid" name="tmcp_select_0">
               <option value="Select Firmness_0" class="tc-multiple-option tc-select-option"  data-price="">Select Firmness</option>
               <option value="Soft_1" class="tc-multiple-option tc-select-option" data-price="1000">Soft</option>
               <option value="Medium_2" class="tc-multiple-option tc-select-option" data-price="1500">Medium</option>
               <option value="Hard_3" class="tc-multiple-option tc-select-option"  data-price="2000">Hard</option>  
             </select>
<span class="price tc-price  hidden">
     <span class="amount"><i class="fa fa-inr"></i>1,000</span>
</span>

现在我想使用onchange事件获得价值

到目前为止我已经尝试了

$(".support-layer-firmness .tc-price span").on("change", function() {

  var price =  $('span.amount').text();
  alert(price);
});

3 个答案:

答案 0 :(得分:1)

您可以使用jquery Class Selector

捕获文本
$('span.amount').text(); // output 1,000
  

类选择器:选择具有给定类的所有元素。 Reference

根据评论,如果你想获得相同的跨度值onChange事件,那么试试这个。

方法1

$('select').on('change', function() {
  $('span.amount').text();
});

方法2

您也可以使用class来选择select元素

$('select.tmcp-field').on('change', function() {
   $('span.amount').text();
});

答案 1 :(得分:1)

请检查此demo

您可以轻松获得跨度值,如下所示。

On Change,你可以做这样的事情

$('.tmcp-select').on('change', function (e) {
      alert($('span.amount').text());
  });

OnChange Example

答案 2 :(得分:1)

使用类名

使用jquery selector
$(".amount").text();

https://jsfiddle.net/mc7h22f7/