javascript - 选择框中选定值的开关/大小写用法

标签 javascript html

我有一个选择框,里面有几个选项。选择一个选项后,Javascript 代码会获取所选选项的值,并且必须相应地更改文本的字体。

我想我会使用 Switch-Case 语句,因为我有多个选项,但它似乎不起作用,没有任何变化。

Javascript

function font() {
    var sf = document.getElementById('box').value;
    var generate = document.getElementById('generate');

    switch (sf) {
        case 'TimesNewRoman':
            generate.style.fontFamily('Times New Roman')
            break;
        case 'Georgia':
            generate.style.fontFamily('Georgia')
            break;
        case 'PalatinoLinotype':
            generate.style.fontFamily('Palatino Linotype')
            break;
        default:
            generate.style.fontFamily('Arial')
    }
}

HTML

<select id="box" onchange="font();">
    <option id="TNR" value="TimesNewRoman">Times New Roman</option>
    <option id="GRG" value="Georgia">Georgia</option>
    <option id="PLT" value="PalatinoLinotype">Palatino Linotype</option>
</select>
<br />
<div id="generate">This is some text</div>

注意

列表中有更多选项,但为了简单起见,我将其缩短。

我使用这个声明是错误的,还是我完全遗漏了什么?

最佳答案

你还没有赋值,使用generate.style.fontFamily = "Arial";

关于javascript - 选择框中选定值的开关/大小写用法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18484238/

相关文章:

html - Chrome 中 float 消失的 iframe

html - 带有盒子的 ionic 和电话间隙中的CSS

html - CSS 代码荧光笔 - 预代码标记中的边距

javascript - DOM 更改后刷新浏览器悬停效果

javascript - 显示最后一个元素后刷新页面

javascript - Feross的simple-peer的代码示例是什么?

javascript - 使用 Javascript 向表格添加按钮

javascript - 输入类型文本 html5 仅接受 12 个逗号分隔值

javascript - Foreach 循环不显示@Html.DisplayFor 中元素之间的空格

html - 半页宽背景