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

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

javascript jquery html css

Javascript Jquery增加DIV中HTML内容的字体大小,javascript,jquery,html,css,Javascript,Jquery,Html,Css,下面是我用来增加#myContent中所有HTML内容字体大小的javascript。奇怪的是，无论何时调用increaseFontSize（），字体大小都不会增加，反而会减少。我做错了什么事，能不能请一些善良的人指点一下。多谢各位我在FontSizest和fontSize上发布了警报。FontSizest读取14，而fontSize读取12。最后一行应该将内容更改为12px，但它没有。字体变小了 : : function increaseFontSize() { var fontSiz

下面是我用来增加#myContent中所有HTML内容字体大小的javascript。奇怪的是，无论何时调用increaseFontSize（），字体大小都不会增加，反而会减少。我做错了什么事，能不能请一些善良的人指点一下。多谢各位

我在FontSizest和fontSize上发布了警报。FontSizest读取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>
:
:

：
:
函数increaseFontSize（）{
var fontsizest=$（“#myContent”）.css（'font-size'）；
var fontSize=parseInt（fontsizest，10）+2；
$（“myContent”）.css（“字体大小”，fontSize+“px”）；
}
:
:
:
:
:
实际内容1
实际内容2
:
:
:
:

[更新]： -在fontSize的末尾添加了“px”。 -从“字体大小”更改为“字体大小”

您需要更新

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

到

请在

fontSize

中添加

，如

font-size

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

使用

这是您的JSFIDLE工作代码


实际内容1
实际内容2
点击我

在我的本地主机上测试，带有html标记，工作正常。

谢谢@Gustaf，感谢您的帮助！谢谢你的回复。它仍然会缩小字体，而不是增加字体大小。不知道为什么…你想增加实际内容1和实际内容2的大小吗？我想增加DIV中的文本。它应该是

$（“#myContent”）.css（“字体大小”，fontSize+“px”）

而不是

$（“#myContent”）.css（“fontSize”，fontSize+“px”）

，注意

font-size

而不是

fontSize

尝试更新答案！！谢谢你的回复。它仍然会缩小字体，而不是增加字体大小。不知道为什么。你能添加

！重要的

像这样的

$（“#myContent”）.css（“字体大小”，fontSize+“px！重要”）

或尝试一件事，首先尝试设置固定值，如

.css（“字体大小”，“40px”）

并检查它是否工作首先尝试设置

var fontSize=40如果有效，请检查代码var fontsizest=$（“#myContent”）.css（'font-size'）；var fontSize=parseInt（fontsizest，10）+2
可能存在问题，因此这不起作用parseInt（fontSizeStr，10）+2
，因为fontSizeStr=14px
其中包含px
，它没有解析为int，因此返回12
使用var fontSizeStr=fontSizeStr.子字符串（0，fontSizeStr.length-2）谢谢你的回复。它仍然会缩小字体，而不是增加字体大小。我在运行不同Android版本（4.3、4.4）的两台设备（通过Phonegap）中测试了代码。不确定为什么它可以在一台设备上工作，但不能在另一台设备上工作。这应该可以。设置字体大小的问题就是我在回答中提到的问题。似乎还有其他一些问题，比如html标记在div中做了什么？此外，如果你为同样的东西制作一个提琴/弹琴，那将是一件很棒的事情
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");
}

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

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

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