jQuery CSS字体粗细正常不起作用答案

【问题标题】：jQuery CSS Font-Weight Normal Not WorkingjQuery CSS字体粗细正常不起作用
【发布时间】：2013-03-18 05:55:02
【问题描述】：

这两天我用谷歌搜索过这个网站，也浏览过这个网站，但没有发现类似的问题。我是 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 sn-p 中搜索 <b> 和 </b>，我通过

解决了我的问题

使用这个： "$(this).find('strong, b').css('font-weight', 'normal')"

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

问题解决了！感谢大家昨天帮助我。

【问题讨论】：

你签入萤火虫了吗？？？？ css 可能不适用于 dom，因为Normal 字体意味着没有 css 只是用作默认字体。
它似乎工作正常？ jsfiddle.net/bXyd8
真的不行。但是当我检查它时，“看起来”粗体的折叠实际上是“不粗体”。我使用的方法是：fontWeight = $(this).css('font-weight'); if (fontWeight == 'bold' || fontWeight == '700') { alert("bold"); $(this).css("font-weight","normal"); }
这个 $(this).css("font-weight", 400); 怎么样
$(this).css("font-weight", 400); //这也失败了。但是问题是由于我的 PHP 代码中“”和“”设置的粗体字体造成的吗？

标签： jquery css

【解决方案1】：

正常也适用于我，但如果您有问题，请尝试将字体粗细设置为空字符串，它将应用默认值，这将是正常的。

Live Demo

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

【讨论】：

同意......如果您使用空字符串，它将被视为正常，并将从 fontweight 中删除粗体
刚刚尝试了上述方法并访问了现场演示页面。即使没有字符串，它也根本不起作用。

【解决方案2】：

您可能对 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();
});

【讨论】：

我的一个 PHP 文件中的 HTML 部分。查看数据

【解决方案3】：

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

【讨论】：

【解决方案4】：

这是我的一个 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>

【讨论】：

那么这有什么问题。？你也忘记了 css 中的;。我已经更新了上面的帖子
所以告诉我只有一个 DOM 具有相同的 id..??因为每个DOM 都必须有唯一的ID。
坦率地说，我是 jQuery 的新手。我正在使用 Symbian、PHP 和现在的 jQuery 进行个人项目。伙计，仍在试图弄清楚 DOM 到底是什么。顺便说一句，我已经尝试过这个“stackoverflow.com/questions/8969689/…”，但它也不适合我。
在阅读本文后，如果我有多个具有相同 ID 的对象/元素，我会告诉你。 en.wikipedia.org/wiki/Document_Object_Model
well DOM 代表文档对象模型。这意味着 p a div h1 h2 都是 DOM...

【解决方案5】：

我的代码基于你的 sn-p：

<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 是否确实是唯一的。

【讨论】：

感谢您的努力，factoradic。不幸的是，已经尝试了您的代码，但仍然没有成功。我认为，根据您的假设，它必须与 Id 有关，我将不得不通过 php 代码进行更改。在旁注中，我想知道为什么“让它变得大胆”只是小菜一碟。
嗯，ID是对的。当提供警报功能而不是字体粗细更改时，会出现警报。那么究竟是什么问题，任何人？
没问题。我不知道出了什么问题。您的代码 sn-p 是正确的。也许你应该显示整个 js 代码。 Firebug for Firefox 有一个特殊的 JavaScript 控制台，它可能会有所帮助。

【解决方案6】：

让我们明确 CSS font-weight 属性

定义和用法

font-weight 属性设置文本中 thick 或 thin 字符的显示方式。

默认值：正常

所以您的代码正在运行，因为您将默认值设置为文本，但不同之处在于您无法直观地看到更改。

【讨论】：

事实上，我通过 PHP 填充了一个表格，并在 PHP 代码中进行了所有格式化。我想知道这是否可能是罪魁祸首。顺便说一句，我正在使用 CSS sn-p，但我不知道如何将它应用于第二个表中所有 td 的表（页面中有两个）。
@asepm 这不是因为最终结果将由浏览器显示。
@asepm 所以您需要在这里提出适当的问题...更新您的问题或使用所有代码和必要信息再次提问...谢谢
Dipesh，感谢您整理我的帖子。为什么我在视觉上看不到变化（粗体到正常），但我确实看到了从正常到粗体的变化？好吧，我可以分辨粗体和不粗体的区别，哈哈……这实际上是我在我的电脑和笔记本上看到的。