如何通过从选项值中选择来乘以输入文本值

Question

我想知道如何通过从标记中选择来乘以元素值？

例如，我有一个<input type='text' value='9'>文本标签或<span>9</span>标签，并且我想通过同样选择选项标签来将其值相乘

<select name="" id="">
    <option value="1">1/month</option>
    <option value="2">2/month</option>
    <option value="3">3/month</option>
    <option value="6">6/month</option>
    <option value="12">12/month</option>
</select>

并且我还希望在选择以下任何以下选项时使用此以下选项值来分配以上选项标签，例如当<option value="9">basic</option>选择上述第一个选项值时的示例，该<option value="9">1/month</option>等等，其值应乘以if 1/month 9*1 if 2/month 9*2 if 3/month 9*3 if 6/month 9*6等。我也想将这些选项值显示到输入标签或跨度标签中。 任何想法如何做到这一点？ 提前谢谢了。

<select name="" id="">
  <option value="9">basic</option>
  <option value="19">standard</option>
  <option value="29">professional</option>
  <option value="59">enterprise</option>
</select>

Answer 1

您需要了解的事情， change事件， data属性， .next()函数和.text()函数

您的html，

<select name="test" id="test">
    <option value="1">1/month</option>
    <option value="2">2/month</option>
    <option value="3">3/month</option>
    <option value="6">6/month</option>
    <option value="12">12/month</option>
</select>

<span data-val="9">9</span>

JS，

$('#test').change(function(){
   var span = $(this).next('span');
   span.text(span.data('val') * parseInt(this.value,10))
});

DEMO