使用 jQuery 更改标签的值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3870707/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Use jQuery to change value of a label
提问by 109221793
I have a label, costLabel.
我有一个标签，costLabel。
What I want to be able to do is change the value of this label depending on the selected value of a dropdownlist.
我想要做的是根据下拉列表的选定值更改此标签的值。
This is my HTML:
这是我的 HTML：
<table>
<tr>
<td width="343">Package*</td>
<td colspan="4">
<select class="purple" name="package">
<option value="standard">Standard - €55 Monthly</option>
<option value="standardAnn">Standard - €49 Monthly</option>
<option value="premium">Premium - €99 Monthly</option>
<option value="premiumAnn" selected="selected">Premium - €89 Monthly</option>
<option value="platinum">Platinum - €149 Monthly</option>
<option value="platinumAnn">Platinum - €134 Monthly</option>
</select>
</td>
<tr>
<td width="343">
<p>We bills quarterly/annually in advance</p>
<p>See <a href="#dialog" name="modal">Pricing</a> for more details</p>
</td>
<td colspan="4"><label id="costlabel" name="costlabel">Total Cost:</label></td>
<tr>
</table>
The values that go into the cost label are
进入成本标签的值是
- Standard = "165 Quarterly"
- StandardAnn = "588 Annually"
- Premium = "297 Quarterly"
- PremiumAnn = "1068 Annually"
- Platinum = "447 Quarterly"
- PlatinumAnn = "1608 Annually"
- 标准 =“165 季刊”
- StandardAnn = "每年 588"
- 溢价 =“297 季刊”
- PremiumAnn = "每年 1068"
- 白金 =“447 季刊”
- PlatinumAnn = "每年 1608"
I did have the following code in place which calculated the cost depending on the dropdown menu, but the registration form has since changed to be more simpler(i.e. discountselection is not gone), and I'm having a bit of trouble adapting the jQuery. Can someone help?
我确实有以下代码，它根据下拉菜单计算成本，但此后注册表变得更简单（即折扣选择没有消失），而且我在适应 jQuery 时遇到了一些麻烦。有人可以帮忙吗？
$(function() {
$("#discountselection, select[name=package], input[name=discount]").
change(function() {
var
selected_value = $("#discountselection").val(),
discount = [12, 24, 36],
package = $("select[name=package]").val(),
package_prices = {'standard': 49, 'premium': 85, 'platinum': 134 },
cost = package_prices[package] * discount[selected_value-1];
$("#costlabel").val(cost);
});
});
回答by David says reinstate Monica
I seem to have a blind spot as regards your html structure, but I thinkthat this is what you're looking for. It should find the currently-selected option from the selectinput, assign its text to the newValvariable and thenapply that variable to the valueattribute of the #costLabellabel:
关于您的 html 结构，我似乎有一个盲点，但我认为这就是您要寻找的。它应该从select输入中找到当前选择的选项，将其文本分配给newVal变量，然后将该变量应用于标签的value属性#costLabel：
jQuery
jQuery
$(document).ready(
function() {
$('select[name=package]').change(
function(){
var newText = $('option:selected',this).text();
$('#costLabel').text('Total price: ' + newText);
}
);
}
);
html:
html：
<form name="thisForm" id="thisForm" action="#" method="post">
<fieldset>
<select name="package" id="package">
<option value="standard">Standard - €55 Monthly</option>
<option value="standardAnn">Standard - €49 Monthly</option>
<option value="premium">Premium - €99 Monthly</option>
<option value="premiumAnn" selected="selected">Premium - €89 Monthly</option>
<option value="platinum">Platinum - €149 Monthly</option>
<option value="platinumAnn">Platinum - €134 Monthly</option>
</select>
</fieldset>
<fieldset>
<label id="costLabel" name="costLabel">Total price: </label>
</fieldset>
</form>
Working demo of the above at: JS Bin
以上工作演示：JS Bin
回答by sod
回答by orca
.text is correct, the following code works for me:
.text 是正确的，以下代码对我有用：
$('#lb'+(n+1)).text(a[i].attributes[n].name+": "+ a[i].attributes[n].value);
回答by user1633617
Validation (HTML5): Attribute 'name' is not a valid attribute of element 'label'.
验证 (HTML5)：属性“名称”不是元素“标签”的有效属性。
