jQuery CSS 字体粗细正常不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15470519/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery CSS Font-Weight Normal Not Working
提问by asepm
I've googled for the last two days and browsed this site, too, but found no similar problem. I am new to jQuery and hope this is no duplicate of other posts.
我在过去两天用谷歌搜索并浏览了这个网站，但没有发现类似的问题。我是 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
Why is it that text font weight cannot be set to NORMAL (in my case)? I use Firefox 17.0.1, but the function to set the font to normal never works in an earlier version of Firefox as well.
为什么不能将文本字体粗细设置为 NORMAL（在我的情况下）？我使用 Firefox 17.0.1，但是将字体设置为正常的功能在早期版本的 Firefox 中也不起作用。
UPDATED:
My problem was finally solved last night, after browsing this site and found quite a similar thing. A few folks had to search for <b>and </b>in an HTML snippet and I fixed my problem by
更新：昨晚我的问题终于解决了，在浏览这个网站后发现了一个非常相似的东西。一些人不得不在 HTML 片段中搜索<b>和</b>，我解决了我的问题
Using this:
"$(this).find('strong, b').css('font-weight', 'normal')"
使用这个：“ $(this).find('strong, b').css('font-weight', 'normal')”
Instead of:
"$(this).css('font-weight', 'normal')".
而不是：“ $(this).css('font-weight', 'normal')”。
Problem solved! Thanks to everyone for lending me a hand yesterday.
问题解决了！感谢大家昨天向我伸出援手。
采纳答案by factoradic
My code based on your snippet:
我的代码基于您的代码段：
<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>
So I think that problem is with this line'td[id="text_linked_to_detail_page"]', maybe try use dot notation. Or check if the ID is certainly unique.
所以我认为问题出在这一行'td[id="text_linked_to_detail_page"]'，也许尝试使用点表示法。或者检查 ID 是否肯定是唯一的。
回答by Adil
回答by Thirumalai murugan
Normat is working fine could you cross check which version of the jquery you are using? give the command so that we also can understand your problem
Normat 工作正常，您可以交叉检查您使用的是哪个版本的 jquery 吗？发出命令，以便我们也能了解您的问题
script
脚本
$("#div1").css("font-weight", "bold");
$("#div2").css("font-weight", "normal");
$("#div3").css("font-weight", "bold");
$("#div4").css("font-weight", "");
HTML
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"/>
回答by asepm
This is the HTML part below PHP code in one of my PHP files.
这是我的一个 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>
回答by Dipesh Parmar
Lets Make clear CSS font-weightProperty
让我们明确 CSSfont-weight属性
Definition and Usage
定义和用法
The font-weightproperty sets how thickor thincharacters in text should be displayed.
该font-weight属性设置文本中的字符thick或thin字符的显示方式。
Default value:normal
默认值：正常
so your code is workingbecause you setting default value to text but difference is you just not visually see the changes.
所以您的代码正在运行，因为您将默认值设置为文本，但不同之处在于您无法直观地看到更改。
回答by factoradic
You might have problem with jQuery not css style.
您可能对 jQuery 而不是 css 样式有问题。
My html:
我的html：
<p id="text">Lorem Ipsum Dolor Sit Amet</p>
<p id="bold">Click to : bold</p>
<p id="normal">Click to : normal</p>
and jQuery:
和 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();
});
