javascript - Dynamically change font-family and font-size

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 code this 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");
 });

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 code this 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");
 });

Share Improve this question edited Nov 22, 2018 at 9:38 Sayed Mohd Ali 2,2543 gold badges13 silver badges31 bronze badges asked Mar 9, 2014 at 19:36 mkafiyan 9542 gold badges9 silver badges31 bronze badges

Simply add and remove classes: addClass() and removeClass()? – Mr. Polywhirl Commented Mar 9, 2014 at 19:39
I don't understand what u say very well!!! – mkafiyan Commented Mar 9, 2014 at 19:41

Add a ment |

1 Answer 1

Sorted by: Reset to default 5

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

$('.changeMe') should be $('.changeme')

UPDATED EXAMPLE HERE

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

});

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

发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744234805a4564423.html

javascript - Dynamically change font-family and font-size - Stack Overflow

1 Answer 1

发表回复

评论列表（0条）

联系我们

400-800-8888

javascript - Dynamically change font-family and font-size - Stack Overflow

1 Answer 1

相关推荐