用span填充选项内的文本的最后一部分

时间:2017-07-13 14:58:43

标签: javascript jquery html

我需要你的帮助。我有一个在线商店的产品有不同的选择(不同的大小,不同的颜色,......)。我做了一个小提琴作为例子:

https://jsfiddle.net/04wbfL28/2/

我的HTML看起来像这样:

    <div id="WA_price">
    <p class="WA_price2">200&nbsp;€</p>
</div>
<div class="product-options">
 <div class="input-box">
        <select name="super_attribute[149]" id="attribute149" class="required-entry super-attribute-select">
            <option value="0">Choose option…</option>
            <option value="28" price="339" data-label="1000 mm">1000 mm +339&nbsp;€</option>
            <option value="30" price="469" data-label="1200 mm" class="selected">1200 mm +469&nbsp;€</option>
            <option value="32" price="599" data-label="1400 mm">1400 mm +599&nbsp;€</option>
        </select>
    </div></div>

我尝试做的是将下拉字段中的价格颜色更改为红色。我想用一个具有内联样式或获得css类但无法找到解决方案的跨度来做到这一点。我也不能说&#34; mm之后的一切都得到了一个跨度包装&#34;因为它并不总是&#34; mm&#34;作为选择选项。

唯一始终相同的是[price value]&nbsp;€,例如149&nbsp;€。你们有没有想过如何用一个跨度包裹这个?提前谢谢。

1 个答案:

答案 0 :(得分:-1)

选项标签上允许的内容是文本和转义字符,而不是其他任何内容。 如果要实现此目的,您应该尝试模拟选择行为。尝试列表。你可以使用jQuery toggle()函数来模拟下拉列表。