动态更改字体系列和字体大小

本文介绍了动态更改字体系列和字体大小的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想动态更改文本的字体和大小

I want to change the fonts and size of the text dynamically

但是我在浏览器中看不到任何答案，在我的代码中也没有错误这是演示

but I don't see any answer in the browser and also no errors in my codethis is demo

html:

<body>
<form id="texteditor">
    <select id="font">
        <option value="School">School</option>
        <option value="SansitaOne">SansitaOne</option>
        <option value="oliver">oliver</option>
        <option value="JuraLight">Jura-Light-webfont</option>
        <option value="Jura">Jura-DemiBold-webfont</option>
        <option value="DJGROSS">DJGROSS-webfont</option>
        <option value="College">College</option>
        <option value="BYekan">BYekan</option>
        <option value="BRoya">BRoya</option>
        <option value="BMitraBold">BMitraBold</option>
        <option value="BMitra">BMitra</option>
    </select>
    <select id="size">
        <option value="7">7</option>
        <option value="10">10</option>
        <option value="15">15</option>
        <option value="17">17</option>
        <option value="20">20</option>
    </select>
</form>
<textarea class="changeme">this is my text example !!!</textarea>
</body>

jquery:

$("#font").change(function() {
//alert($(this).val());
$('.changeMe').css("font-family", $(this).val());

  });



 $("#size").change(function() {
 $('.changeMe').css("font-size", $(this).val() + "px");
 });

推荐答案

除了示例中不包括jQuery外，您还有错字.

Aside from not including jQuery in the example, you had a typo.

$('.changeMe')应该是$('.changeme')

此处更新了示例

$("#font").change(function() {
    $('.changeme').css("font-family", $(this).val());

});

$("#size").change(function() {
    $('.changeme').css("font-size", $(this).val() + "px");
});

这篇关于动态更改字体系列和字体大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！