Jquery增加DIV中HTML内容的字体大小

Jquery to increase font size of HTML contents in DIV

本文关键字:字体 增加 DIV HTML Jquery      更新时间:2023-09-26

下面是我用来增加#myContent中所有HTML内容的字体大小的javascript。奇怪的是,每当调用increaseFontSize((时,字体大小并没有增加,反而会减少。一些善良的灵魂能就我做错了什么提出建议吗。非常感谢。

我在fontSizeStr和fontSize上发布了警报。fontSizeStr读取14,而fontSize读取12。最后一行应该将内容更改为12px,但没有。字体变小了。

:
:
function increaseFontSize() {
   var fontSizeStr = $("#myContent").css('font-size');
   var fontSize = parseInt (fontSizeStr,10) + 2;
   $("#myContent").css("font-size", fontSize + "px");
}
:
:
:
<div id="myContent">
    <html>
    :
    :
    <p>Actual Contents 1</p>
    <p>Actual Contents 2</p>
    :
    :
    </html>
</div>
:
:

[更新]:-在fontSize的末尾添加了"px"。-从"fontSize"更改为"font size">

您需要更新

 $("#myContent").css("fontSize", fontSize);

 $("#myContent").css("font-size", fontSize + "px");

请像font-size 一样在fontSize中添加-

$("#myContent").css("font-size", fontSize + "px");

使用

var fontSizeStr= fontSizeStr.substring(0,fontSizeStr.length-2);
function increaseFontSize() {
   var fontSizeStr = $("#myContent").css('font-size');
   var fontSize = fontSizeStr.substring(fontSizeStr.length-2, fontSizeStr.length);
   var newFontSize = parseInt (fontSize,10) + 2;
   $("#myContent").css("font-size", newFontSize + "px");
}

这是JSFIDDLE的工作代码。

http://jsfiddle.net/alaksandarjesus/xju2xksp/1/

<div id="myContent">
    <p>Actual Contents 1</p>
    <p>Actual Contents 2</p>
</div>
<button onClick="increaseFontSize()">Click Me</button>

在我的localhost中进行了测试,使用html标记,工作正常。