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

【问题标题】：Jquery to increase font size of HTML contents in DIVJquery增加DIV中HTML内容的字体大小
【发布时间】：2015-07-04 22:48:08
【问题描述】：

下面是我用来增加#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”

【问题讨论】：

标签： javascript jquery html css

【解决方案1】：

你需要更新

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

到

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

【讨论】：

感谢您的回复。它仍然缩小字体而不是增加字体大小。我在运行不同 Android 版本（4.3、4.4）的两台设备（通过 Phonegap）中测试了代码。不知道为什么它可以在一台设备上运行，但不能在另一台设备上运行。
这应该可以。设置字体大小的问题是我在回答中提到的问题。似乎还有其他一些问题，例如 html 标签在 div 中做什么？此外，如果您为此创建一个小提琴/plunker，那就太好了

【解决方案2】：

请在fontSize 中添加- 喜欢font-size

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

使用

var fontSizeStr= fontSizeStr.substring(0,fontSizeStr.length-2);

【讨论】：

感谢您的回复。它仍然缩小字体而不是增加字体大小。不知道为什么。
你能像这样添加!mportant $("#myContent").css("font-size", fontSize + "px !important"); 还是先尝试另一件事尝试设置固定值，如.css("font-size", "40px"); 并检查它是否有效
先尝试设置var fontSize = 40;，如果可行，请检查代码var fontSizeStr = $("#myContent").css('font-size'); var fontSize = parseInt (fontSizeStr,10) + 2;可能有问题
所以这不起作用parseInt (fontSizeStr,10) + 2，因为fontSizeStr=14px 包含px，它没有解析成int，所以它返回12
使用var fontSize = fontSizeStr.substring( 0,fontSizeStr.length-2);

【解决方案3】：

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

【讨论】：

感谢@Gustaf，感谢您的帮助！
感谢您的回复。它仍然缩小字体而不是增加字体大小。不知道为什么....
你想增加<p>Actual Contents 1</p>和<p>Actual Contents 2</p>等的大小吗？
我想增加DIV内的文字。
应该是$("#myContent").css("font-size", fontSize + "px");而不是$("#myContent").css("fontSize", fontSize + "px");，注意font-size而不是fontSize试试更新的答案！！

【解决方案4】：

这是你的 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>

在我的本地主机中测试，带有 html 标签，它工作正常。

【讨论】：