更改span标记onchange事件jquery的值

时间:2012-04-18 11:59:17

标签: jquery events onchange html

我试图在用户从下拉列表中选择一个选项时更改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")     
                        }

                    });

        });

2 个答案:

答案 0 :(得分:3)

$('#mmt option:selected').text()将返回"METRIC""ENGLISH",但不会返回"English"

您需要select元素的,而不是所选option的文字内容。
对于该用途$('#mmt').val() [docs],或仅$(this).val(),因为this指的是select元素。

DEMO

答案 1 :(得分:0)

你需要在这里更新你的jquery是解决方案;

$(function() {          
           $('#mmt').change(function() {

           if ($('#mmt option:selected').val() =="English") {
               $('.ms').text("INCH");

               }
           else {
               $('.ms').text("MM")     
           }

          });

        });

您可以查看JSFiddle