我试图在用户从下拉列表中选择一个选项时更改span的值,但这似乎不起作用。
HTML:
<tr>
<td class="field" colspan="4">
<select id="mmt">
<option value="Metric" selected>METRIC</option>
<option value="English">ENGLISH</option>
</select></td>
</tr>
<tr>
<td class="head"><label for="abc">ABC</label></td>
<td class="field"><input type="text" id="abc"/><span class="m">MM</span> OD</td>
<td class="head"><label for="pqr"></label></td>
<td class="field"><input type="text" id="pqr" /><span class="ms">MM</span></td>
</tr>
<tr>
<td class="head"><label for="xyz">XYZ</label></td>
<td class="field"><input type="text" id="xyz" /></td>
<td class="head"><label for="stu"></label></td>
<td class="field"><input type="text" id="stu"/><span class="ms">MM</span></td>
</tr>
jQuery的:
$(function() {
$('#mmt').change(function() {
if ($('#mmt option:selected').text() == "English") {
$('.ms').text("INCH");
}
else {
$('.ms').text("MM")
}
});
});
答案 0 :(得分:3)
$('#mmt option:selected').text()
将返回"METRIC"
或"ENGLISH"
,但不会返回"English"
。
您需要select
元素的值,而不是所选option
的文字内容。
对于该用途$('#mmt').val()
[docs],或仅$(this).val()
,因为this
指的是select
元素。
答案 1 :(得分:0)
你需要在这里更新你的jquery是解决方案;
$(function() {
$('#mmt').change(function() {
if ($('#mmt option:selected').val() =="English") {
$('.ms').text("INCH");
}
else {
$('.ms').text("MM")
}
});
});
您可以查看JSFiddle