jQuery를 - 배열로 각 리튬의 클래스를 얻을

나는 10 개 가지 메뉴 항목, 그들 모두는 다음과 같이, 다른 색깔의 테두리를 가지고 있습니다jQuery를 - 배열로 각 리튬의 클래스를 얻을

<ul id="flipbox" class="main-menu" align="right"> 
<li class="item cyan active"><a href="#" alt="" title="">item 1</a></li> 
<li class="item orange"><a href="#" alt="" title="">item 2</a></li> 
<li class="item yellow"><a href="#" alt="" title="">item 3</a></li> 
<li class="item brown"><a href="#" alt="" title="">item 4</a></li> 
<li class="item blue"><a href="#" alt="" title="">item 5</a></li> 
<li class="item pink"><a href="#" alt="" title="">item 6</a></li> 
<li class="item green "><a href="#" alt="" title="">item 7</a></li> 
<li class="item sand"><a href="#" alt="" title="">item 8</a></li> 
<li class="item darkgray"><a href="#" alt="" title="">item 9</a></li> 
</ul>

공지 사항 첫 번째 리, 클래스를 '활성'. jQuery를 통해 액티브 li의 bgcolor를 테두리에 사용되는 색상으로 변경하고 싶습니다. 그런 일이 가능한가? 지금은이 코드를 생각해 냈지만 버그가있는 것으로 보입니다. 나는 아직이 작업의 두 번째 부분을 얻지 못했다. (색상을 얻고 적용하라.)

// Current menu item function 
$(document).ready(function(){ 

// Array with li classes 
var menuItems = []; 
$(".main-menu li").each(function() { menuItems.push($(this).attr('class').split(' ')) }); 
for (n = 0; n < 9; n++) { 
    for (m = 0; m < 3; m++) 
    if (menuItems[n] === 'active') { 
     alert('.' + menuItems[n][m]); 
    } 
} 
});

출처

2014-04-10 Vidlička LujVitóón

문제는 무엇인가? –

조금 더 자세히 설명해 주시겠습니까? 'menuItems' 배열로 무엇을 얻으려고합니까? –

'menuItems'가 2D 배열 인 경우 항목이 결코 활성화되지 않습니다 – Scimonster

난 당신이 활성 클래스와 스타일리스트의 항목을 원하는 경우이 JQuery와, 죄송하지만, 다음 CSS를 사용하지 알고 :

li.cyan { 
    background-color: cyan; 
} 
li.cyan.active { 
    background-color: somethingelse; 
}

편집 : jQuery를에

, 모든 활성 목록 항목의 배경색을 테두리 색으로 변경하는 방법 :

$(".main-menu li.active").each(function() { 
    var borderColor = $(this).css('border-color'); 
    $(this).css('background-color', borderColor); 
});

출처

2014-04-10 12:17:37 happyjack

예,하지만 그것은 또 다른 10 개의 클래스입니다. 나는 jQuery로 할 수 있는지 알고 싶다. –

jQuery에서 사용했다하더라도 어느 시점에서 각 요소의 테두리/배경색을 개별적으로 정의해야한다고 생각합니다. 모든 jQuery는 스타일을 수동으로 변경하기 때문에 CSS에서 정의하는 것이 훨씬 간단합니다. 또한 활성 요소를 변경하려는 색에 따라 CSS에서보다 컴팩트 한 것을 사용할 수 있습니다. – happyjack

jQuery는 CSS 값을 '읽었'고 다른 속성에 할당 할 수 없습니까? –

다음 작업을 수행해야합니다.

$(".main-menu li").css('background-color', null) 
    .filter('.active').css('background-color', function() { 
     var classes = $(this).attr('class').split(/\s+/); 
     for (var i = 0; i < classes.length; i++) { 
      if (classes[i] !== 'item' && classes[i] !== 'active') 
        return classes[i]; 
     } 
     return 'none'; 
    });

jsFiddle

출처

2014-04-10 13:10:14 GregL

jQuery를 - 배열로 각 리튬의 클래스를 얻을

답변

관련 문제