如何dynamic添加使用jQuery文本alignment的样式
我试图纠正常见的IE浏览器错误周围的CSS 2.1,并需要一种方法来改变元素样式属性添加自定义文本alignment样式。
目前在jQuery中,你可以做类似的事情
$(this).width( or $(this).height(
但我似乎无法find一个好方法来改变文本alignmentw /这种相同的方法。
该项目已经有一个类,我没有运气设置在该类的文本alignment。 在定义类之后,是否可以添加一个文本alignmentcss属性?
我有这样的事情
$(this).css("text-align", "center");
只是在我的宽度调整后,我看到这个在萤火虫中,我看到只有“宽度”是风格上设置的唯一属性…任何帮助?
编辑:
哇 – 在这个问题上的回应很大! 感谢所有回答的人! 关于手头问题的更多细节:
我调整了jqGrid A3.5的js源代码,做了一些自定义的子网格工作,实际的JS调整如下所示(抱歉在上面的例子中使用了“this”,但是我想保持这个简单简洁)
var subGridJson = function(sjxml, sbid) { var tbl, trdiv, tddiv, result = "", i, cur, sgmap, dummy = document.createElement("table"); tbl = document.createElement("tbody"); $(dummy).attr({ cellSpacing: "0", cellPadding: "0", border: "0" }); trdiv = document.createElement("tr"); for (i = 0; i < ts.p.subGridModel[0].name.length; i++) { tddiv = document.createElement("th"); tddiv.className = "ui-state-default ui-th-column"; $(tddiv).html(ts.p.subGridModel[0].name[i]); $(tddiv).width(ts.p.subGridModel[0].width[i]); trdiv.appendChild(tddiv); } tbl.appendChild(trdiv);
我已经尝试了下面的两个(从提供的答案)没有运气。
$(tddiv).width(ts.p.subGridModel[0].width[i]).attr('style', 'text-align: center');
和
$(tddiv).width(ts.p.subGridModel[0].width[i]).css('text-align', 'center');
今天我将继续在这个问题上工作,并发表最后的解决scheme,让任何人感到我的痛苦围绕这个奇怪的问题。
你有正确的想法,正如文件显示:
http://docs.jquery.com/CSS/css#namevalue
你确定你正确地识别这个类或ID?
例如,如果你的类是myElementClass的话
$('.myElementClass').css('text-align','center');
另外,我有一段时间没有和Firebug一起工作,但是你在看dom而不是html吗? 你的源码不会被javascript改变,但是DOM是。 在dom选项卡中查看是否应用了更改。
你也可以尝试下面的内容添加一个内联样式到元素:
$(this).attr('style', 'text-align: center');
这应该确保其他样式规则不会压倒你认为会起作用的东西。 我相信内联样式通常优先。
编辑:另外,另一个可能会帮助你的工具是Jash( http://www.billyreisinger.com/jash/ )。 它给你一个JavaScript命令提示符,这样你就可以确保你轻松地testingjavascript语句,并确保你正在select正确的元素,等等。
我通常使用
$(this).css({ "textAlign":"center", "secondCSSProperty":"value" });
希望有所帮助
我认为你应该使用“textAlign”而不是“文本alignment”。
有趣。 当我编写testing版本时,我遇到了同样的问题。
解决的办法是使用jQuery的链接和做的能力:
$(this).width(500).css("text-align", "center");
有趣的发现虽然。
要扩大一点,以下是不行的
$(this).width(500); $(this).css("text-align", "center");
并且仅在样式上设置宽度的结果。 如上所述,把两者联系起来看起来似乎有效。
是正确的?
<script> $( "#box" ).one( "click", function() { $( this ).css( "width", "+=200" ); }); </script>
$(this).css("text-align", "center");
应该工作,确保“this”是你实际上试图设置文本alignment样式的元素。
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script> $( document ).ready(function() { $this = $('h1'); $this.css('color','#3498db'); $this.css('text-align','center'); $this.css('border','1px solid #ededed'); }); </script> </head> <body> <h1>Title</h1> </body> </html>
$(this).css({'text-align':'center'});
你可以使用类名和id代替这个
$('.classname').css({'text-align':'center'});
要么
$('#id').css({'text-align':'center'});