我正在 jquery 中创建一个 textarea 字段。当我在该文本区域输入任何内容时,如果我更改字体系列、字体颜色和字体大小,它应该会更改。
在我下面的代码中,当我在文本区域中写入任何内容并更改字体系列和字体颜色时,它会发生变化,但是当我尝试更改字体大小时,它并没有发生变化。我有字体大小作为文本区域意味着无论我给它什么大小都应该改变,但这个问题我无法解决。
请任何人都可以帮我解决这个问题。
$("#ff").change(function() {
$('.changeMe').css("font-family", $(this).val());
});
$("#size").change(function() {
$('.changeMe').css("font-size", $(this).val() + "px");
});
$("#color").change(function() {
$('.changeMe').css("color", $(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="padding-top:120px; padding-left:120px">
<textarea rows="8" cols="50" class="changeMe" placeholder="Enter something"></textarea>
<br><br>
<form id="myform">
<label>Select Font Family</label>
<select id="ff">
<option value="Arial">Arial</option>
<option value="Verdana">Verdana </option>
<option value="Times ">Times New Roman</option>
<option value="Impact">Impact</option>
</select><br><br>
<label>Select Font size</label>
<input type="text" id="size"><br><br>
<label>Select color</label>
<select id="color">
<option value="orange" style="background-color: orange;">orange</option>
<option value="red" style="background-color: red;">red</option>
<option value="pink" style="background-color: pink;">pink</option>
<option value="blue" style="background-color: blue;">blue</option>
</select><br><br>
</form>
</div>
您应该使用以下代码来实现您想要的。此 keyup 函数将在每个按键事件上更改字体大小。
$("#size").on("keyup", function() {
$('.changeMe').css("font-size", $(this).val() + "px");
});
我希望这可以帮助你。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句