0

我有一个可以更改样式表的 Web 程序（不要问），我需要使用 jquery 获取类的背景颜色属性值。类如下所示，但每个样式表都有不同的颜色。

DIV.row.error DIV.field INPUT.input-field

{背景：#fbdad8；边框：1px #ef4035 实心；-webkit-border-radius：0.3em；-moz-边界半径：0.3em；-o-边界半径：0.3em；边界半径：0.3em；}

我之前尝试过使用代码，但它总是白色的，有什么想法吗？

      var checked = $('#<%=chkTermsAgreed.ClientID %>').attr('checked');
      var toChange = $('#<%=lblTermsAgreed.ClientID %>')

      if (!checked) {

          var bgColor = $('<div class=\"row error\"><input class=\"input-field\"/></div>').hide().appendTo("body");
          bgColor = bgColor.find('.input-field');
          toChange.css('background-color', bgColor.css('background-color'));
          bgColor.remove();
       }
4

2 回答 2

2

即使不存在类的元素，我看到的唯一能够获取背景颜色的解决方案是读取 js 中的样式表。

好消息是它们是可浏览的对象，并且在它们尚未解析时读取它们是有效的。

例如，您可以迭代所有这样的规则，以找到您的背景颜色：

for (var i=0; i<document.styleSheets.length; i++) {
        var styleSheet = document.styleSheets[i];
        var cssRules = styleSheet.rules; // chrome, IE
        if (!cssRules) cssRules = styleSheet.cssRules; // firefox
        for (var j=0; j<cssRules.length; j++) {
            var rule = cssRules[j];
            console.log(styleSheet.href, rule);
            if (rule.selectorText=="DIV.row.error DIV.field INPUT.input-field") {
                console.log('found it : ', rule.style.getPropertyValue('background-color'));
            }
        }
    }
}
于 2012-04-26T14:14:54.813 回答
0

据我了解，您正在尝试获得$('div.row.error input[class="input-field"]')类的背景颜色样式。当你明确你想要得到的东西时，这个问题就会自行解决：

  • 类选择器足以标记没有空格的名称
  • 您可以通过 tag[attribute="value"] 选择器选择具有属性的元素
  • 如果您在编写主选择器时有足够的空间并输入新的选择器；你会发现前者的子选择器。
  • 如果您选择具有类的元素或组，您可以更改或获取它的任何属性。

现在让我们编码。这是我的建议：

var checked = $('#<%=chkTermsAgreed.ClientID %>').attr('checked');
var toChange = $('#<%=lblTermsAgreed.ClientID %>');
var source = $('div.row.error input[class="input-field"]');

if (!checked) {
    toChange.css('background-color', source.css('background-color'));
}

我在检查器中尝试了选择器。有用。希望这可以帮助。干杯。

于 2012-04-26T14:57:01.180 回答