Question

我知道这可能不是如何使用选择器，而是

有没有明显的方法可以拥有这样的例子：

<option value="2">Number of guests <span>4</span></option>

类似于：

结果：

<span class="selecter-item" data-value="4">Number of guests <span>4</span></span>

注意包装的数字。这就是我想要实现的，某种方式来捕获中的值，或者作为的属性并将其附加到 .selecter-item

中

一种想法是使用JQ来查找每个选项的“数据值”并为每个相关的选择项添加该值？我不确定这是不是一个很好的方法。

Answer 1

这是我最终做的事情。它可能不是最好的方法，但是出于我的目的。

我的HTML：

<select name="guests-count" id="guests-count">
  <option value="0">4</option>
  <option value="4">4</option>
  <option value="8">8</option>
  <option value="12">12</option>
  <option value="16">16</option>
  <option value="20">20</option>
  <option value="24">24</option>
</select>

我使用了这段脚本：

$("#guests select").selecter({
  callback: onChange
});

guests = ' <span>Guests</span>';

// Append 'Guests' to the values
$('.selecter-selected').append(guests);
$('.selecter-item').append(guests);

给了我这个HTML：

<div class="selecter-options">
  <span class="selecter-item selected first" data-value="0">4 
    <span>Guests</span>
  </span>
  <span class="selecter-item" data-value="4">4 
    <span>Guests</span>
  </span>
  <span class="selecter-item" data-value="8">8 
    <span>Guests</span>
  </span>
  <!-- etc -->
</div>

这足以让来自＆＃34;客人＆＃34;的数字分开。措辞。

如何格式化Jquery.fs.selecter.js中的文本selecter-item（<option>）</option>

1 个答案: