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

时间:2015-07-04 12:57:12

标签: javascript jquery html css

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

[更新] : - 添加&#34; px&#34;到fontSize的末尾。 - 改为&#34; fontSize&#34;到&#34; font-size&#34;

4 个答案:

答案 0 :(得分:1)

您需要更新

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

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

答案 1 :(得分:1)

请在-中添加fontSize,如font-size

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

使用

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

答案 2 :(得分:0)

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

答案 3 :(得分:0)

这是您的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标签,工作正常。