javascript - 使用 jquery 捕获跨度值

Question

大家好，我想使用 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);
});

Answer 1

您可以使用 jquery 捕获文本 Class Selector

$('span.amount').text(); // output 1,000

Class Selector: Selects all elements with the given class. Reference

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

方法一

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

方法二

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

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