仅更改所选选项的文本答案

【问题标题】：Change text of selected option only仅更改所选选项的文本
【发布时间】：2014-04-04 03:56:05
【问题描述】：

我遇到了一个问题。我有一个包含多个选项的选择框

<select name="p_hour">
<option value="00">12 am</option>
<option value="01">1 am</option>
<option value="02">2 am</option>
<option value="03">3 am</option>
<option value="04">4 am</option>
<option value="05">5 am</option>
<option value="06">6 am</option>
<option value="07">7 am</option>
<option value="08">8 am</option>
<option value="09">9 am</option>
<option value="10">10 am</option>
</select>

我想要实现的是，当有人做出选择时，选项中的文本应仅更改为数字，而无需上午/下午。代码是

jQuery("select[name='p_hour']").on('change', function() {
    $selectedval = jQuery("select[name='p_hour'] option:selected").text();
    $selectedval = $selectedval.slice(0,-2);
    jQuery("select[name='p_hour'] option:selected").text($selectedval);
    $selectedval = '';
});

但问题是选项的文本仅在进行另一个选择时才保留数字，我只想更改所选选项的文本。谁能帮帮我？

【问题讨论】：

工作演示：jsfiddle.net/qsDn5/92
如果我理解正确，例如您选择了凌晨 1 点，它将变为 1。但如果我更改值（例如凌晨 3 点），则 1 应该回到凌晨 1 点，凌晨 3 点回到 3 . 对吗？

标签： jquery select onchange

【解决方案1】：

可能不是最优雅的方式，但试试

jQuery(function ($) {
    var selectedval, $select = $("select[name='p_hour']"),
        $prev;
    $select.on('change', function () {
        var $cur = $select.find("option:selected")
        if ($prev) {
            if ($prev.is($cur)) {
                return;
            }
            $prev.text(selectedval);
        }
        selectedval = $cur.text();
        $cur.text(selectedval.slice(0, -2));
        $prev = $cur
    }).change()
})

演示：Fiddle

【讨论】：

【解决方案2】：

这是因为您缺少 ); 来关闭您的 .on() 处理程序并确保您已将代码放入 DOM 就绪处理程序中：

jQuery(function () {
    jQuery("select[name='p_hour']").on('change', function () {
        $selectedval = jQuery("select[name='p_hour'] option:selected").text();
        $selectedval = $selectedval.slice(0, -2);
        alert($selectedval);
        jQuery("select[name='p_hour'] option:selected").text($selectedval);
        $selectedval = '';
    }); // <-- Here
});

Fiddle Demo

【讨论】：

对不起，这是一个拼写错误，我已经编辑了我的问题，请看看我想要实现的目标。
是的，但问题是，如果从下拉列表中的凌晨 1 点，它会更改 1，如果再次选择，则 1 仍然存在我只想更改所选选项的文本