jQuery CSS字体重量正常不起作用

时间:2013-03-18 05:55:02

标签: jquery css

我最近两天用Google搜索并浏览了这个网站,但没有发现类似的问题。我是jQuery的新手,希望这与其他帖子没有重复。

$(this).css("font-weight", "bold"); //this works
$(this).css({"font-weight":"bold"}); //this works as well

$(this).css("font-weight", "normal"); //this doesn't work
$(this).css({"font-weight":"normal"}); //this doesn't work either

为什么文本字体权重不能设置为NORMAL(在我的情况下)?我使用Firefox 17.0.1,但将字体设置为正常的功能也不适用于早期版本的Firefox。

已更新: 昨晚我的问题终于解决了,浏览了这个网站后发现了类似的东西。有些人不得不在HTML代码段中搜索<b></b>,我通过

修复了我的问题

使用此: “$(this).find('strong, b').css('font-weight', 'normal')

而不是: “$(this).css('font-weight', 'normal')”。

问题解决了!感谢大家昨天借给我一个手。

6 个答案:

答案 0 :(得分:1)

正常也适用于我但是如果你有问题,尝试将font-weight设置为空字符串,它会应用默认值,这是正常的。

Live Demo

$(this).css("font-weight", "");

答案 1 :(得分:1)

Normat工作正常你可以交叉检查你正在使用哪个版本的jquery?给出命令,以便我们也能理解你的问题

脚本

$("#div1").css("font-weight", "bold");
$("#div2").css("font-weight", "normal");
$("#div3").css("font-weight", "bold");
$("#div4").css("font-weight", "");

HTML

<div id="div1" >some text</div>
<div id="div2" >some text</div>
<div id="div3" >some text</div>
<div id="div4" >some text</div>
<input type="button" onclick="javascript:$('#div1').css('font-weight','normal')" value="Normal"/>
<input type="button" onclick="javascript:$('#div1').css('font-weight','bold')" value="Bold"/>

DEMO

答案 2 :(得分:1)

这是我的一个PHP文件中PHP代码下面的HTML部分。

<html>
    <head>
    <style type="text/css">
        td a:link {text-decoration: none; color: inherit;}
        td a:visited {text-decoration: none; color: inherit;}
        td a:active {text-decoration: none; color: inherit;}
        td a:hover {text-decoration: underline; color: blue;}
    </style>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function()
        {
            $('td[id="text_linked_to_detail_page"]').click(function(event)
            {
                $(this).css("font-weight", "normal");
                event.preventDefault();
            });
        });
    </script>
    <title>View Data</title>
</head>
<body>
</body>
</html>

答案 3 :(得分:0)

让我们明确CSS font-weight属性

定义和用法

font-weight属性设置应如何显示文本中thickthin个字符。

默认值:正常

所以您的代码正在运行,因为您将默认值设置为文字,但区别在于您无法直观地看到更改。

答案 4 :(得分:0)

您可能遇到jQuery问题,而不是css样式。

我的HTML:

<p id="text">Lorem Ipsum Dolor Sit Amet</p>
<p id="bold">Click to : bold</p>
<p id="normal">Click to : normal</p>

和jQuery:

function action() {
    "use strict";
    $("#normal").click(function () {
        $("#text").css("font-weight", "normal");
    });
    $("#bold").click(function () {
        $("#text").css("font-weight", "bold");
    });
}

$(document).ready(function () {
    "use strict";
    action();
});

答案 5 :(得分:0)

我的代码基于您的代码段:

<html>
    <head>
    <style type="text/css">
        td a:link {text-decoration: none; color: inherit; }
        td a:visited {text-decoration: none; color: inherit; }
        td a:active {text-decoration: none; color: inherit; }
        td a:hover {text-decoration: underline; color: blue; }
    </style>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        /*global $, jQuery, document*/
        $(document).ready(function () {
            "use strict";
            $('#text').click(function (event) {
                $(this).css("font-weight", "normal");
                event.preventDefault();
            });
        });
    </script>
    <title>View Data</title>
</head>
<body>
<p id="text" style="font-weight: bold;">Lorem ipsum</p>
</body>
</html>

DEMO

所以我认为问题在于这一行'td[id="text_linked_to_detail_page"]',也许可以尝试使用点符号。或者检查ID是否确实是唯一的。