0

我试图使用 jQuery 获取 left 属性,其中 css 写为

#sldn_mnu li:hover ul ul {left:-6000;}

下面是我的警报,它输出(-7000),它是左道具。这种风格:#sldn_mnu ul ul {left:-7000;}。有任何想法吗?谢谢。

alert($('#sldn_mnu li').hover().find('ul ul').css('left'));

相关 html: 我正在尝试与辅助 <ul> 项目 1.1.1 下拉列表交谈。

<div id="sldn_mnu">
    <ul>
    <li><a href="#">HELLO</a></li>
    <li class="sldn_mnu-drop"><a href="#" ><span class="sldn_mnu-label">WORK</span></a>
        <ul>
          <li class="sldn_mnu-subDrop"><a href="#">Item 1.1</a>
            <ul>
              <li><a href="#" >Item 1.1.1</a></li>
              <li><a href="#" >Item 1.1.2</a></li>
            </ul>
          </li>
          <li><a href="#" >Item 1.2</a></li>
          <li><a href="#" >Item 1.3</a></li>
        </ul>
      </li>
      <li><a href="#" >Item 2</a>
        <ul>
          <li><a href="#" >Item 2.1</a></li>
          <li><a href="#" >Item 2.2</a></li>
          <li><a href="#" >Item 2.3</a></li>
        </ul>
      </li>
      <li><a href="#">Item 3</a></li>
    </ul>

4

2 回答 2

0

如果 CSS 来自样式表(并且伪类总是这样做,因为您不能将它们内联添加),则不能使用纯 jQuery 来检索它。

相反,您需要查看document.styleSheets.

以下代码改编自此答案。它遍历所有样式表并寻找匹配的 CSS 规则。

工作演示在这里。

function getStyle(selector) {
    for(var y=0;y<document.styleSheets.length;y++){
        var classes = document.styleSheets[y].rules || document.styleSheets[y].cssRules
        for(var x=0;x<classes.length;x++) {
            if(classes[x].selectorText.match(selector)) {
                    (classes[x].cssText) ? alert(classes[x].cssText) : alert(classes[x].style.cssText);
            }
        }
    }
}

getStyle(/sldn_mnu.*hover/);

请注意,我调整了函数以使用正则表达式匹配而不是简单的字符串比较。

而不是警报,您可能希望在第一次匹配后返回,或者可能返回所有匹配的数组。

于 2012-11-01T13:07:19.423 回答
0

您可以做的是覆盖“悬停”事件并在那里执行您的操作,例如:

JS:

$('#sldn_mnu li').bind('hover',function(e){
  //console.log($(this).find('ul ul').css('left'));
  alert($(this).find('ul ul').css('left'));
});​

但是,如果您向<ul>要询问的CSS 类添加一个 CSS 类会更简单left,那么您可以只写:

console.log($(this).find('ul.<your_ul_css_class>').css('left'));

另一个简化是添加一个 css 类来<li>触发计算,那么所有这些都可能是这样的:

$('li.<your_li_css_class>').bind('hover',function(e){
  console.log($(this).find('ul.<your_ul_css_class>').css('left'));
});​
于 2012-11-01T11:11:43.793 回答