gpt4 book ai didi

jQuery 更改字体系列和字体大小

转载 作者:行者123 更新时间:2023-12-03 21:33:18 24 4
gpt4 key购买 nike

我试图通过从列表中选择字体来更改文本区域和容器中显示的文本的字体系列和字体大小,字体大小应该是固定的。我还尝试在选择字体时更改背景颜色。

这是我的代码:

    <script type="text/javascript">     
function changeFont(_name) {
document.body.style.fontFamily = _name;
document.textarea = _name;
}
</script>

</head>
<body style="font-family">
<form id="myform">
<input type="text" />
<button>erase</button>
<select id="fs" onchange="changeFont(this.value);">
<option value="arial">Arial</option>
<option value="verdana">Verdana</option>
<option value="impact">Impact</option>
<option value="'ms comic sans'">MS Comic Sans</option>
</select>
<div align="left">
<textarea style="resize: none;" id="mytextarea"
cols="25" rows="3" readonly="readonly" wrap="on">
Textarea
</textarea>
<div id='container'>
<div id='float'>
<p>This is a container</p>
</div>
</form>
</body>

当我在浏览器中尝试时,文本区域中的字体系列没有改变。它仅在容器中发生变化。我现在还知道如何在选择字体系列时为容器和文本区域设置新的字体大小和背景。

我将不胜感激任何帮助!

最佳答案

完整的工作解决方案:

HTML:

<form id="myform">
<button>erase</button>
<select id="fs">
<option value="Arial">Arial</option>
<option value="Verdana ">Verdana </option>
<option value="Impact ">Impact </option>
<option value="Comic Sans MS">Comic Sans MS</option>
</select>

<select id="size">
<option value="7">7</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
</select>
</form>

<br/>

<textarea class="changeMe">Text into textarea</textarea>
<div id="container" class="changeMe">
<div id="float">
<p>
Text into container
</p>
</div>
</div>

jQuery:

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

});

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

在这里摆弄:http://jsfiddle.net/AaT9b/

关于jQuery 更改字体系列和字体大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7654708/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com