我很茫然,我试图让用户选择某些文本输出的字体系列。代码基本上可以归结为:
<div id='output'>
The quick brown fox jumps over the lazy dog
</div>
<select id='font-select'>
<option value='Lucida Console'>Lucida Console</option>
<option value='Courier New'>Courier New</option>
<option value='Consolas'>Consolas</option>
</select>
使用 jquery 如下:
$(document).ready(
function()
{
$('font-select').on( 'change',
function()
{
$('output').css( 'font-family', $('#font-select').val() );
console.log( 'Font changed' );
});
});
我知道每次选择不同的字体时都会触发 on-change 事件,但 div 中的字体只会在我第一次选择时发生变化。之后,我仍然在控制台中收到“字体已更改”通知,但#output div 没有实际更改。
我试过把它改成
$(document).on( 'change', '#font-select',
....
我也尝试过将 id 更改为类并通过类进行选择
$('.font-select').change(
....
同样的结果。有人有什么建议吗?
最佳答案
问题与您使用的选择器有关。当您尝试通过 id 访问元素时,您应该在前面添加 #。
这里是 [fiddler][1],可以很好地解决您的问题
希望对您有所帮助。
[1]: https://jsfiddle.net/rajsnd08/nfh5craz/
关于javascript - 自定义字体选择器只改变一次字体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45753629/