jquery에서 클래스를 잡고 다른 클래스를 추가하는 방법은 무엇입니까?

탐색 할 때 페이지에 활성 클래스를 추가하는 코드 조각을 만들려고합니다. 과거 ID와 함께 사용 해봤지만 정상적으로 작동하지만 부트 스트랩 기능을 사용할 수 있도록 지금은 클래스가 필요합니다.jquery에서 클래스를 잡고 다른 클래스를 추가하는 방법은 무엇입니까?

var mybodyid = $('body').attr('id'); 
var mynavid = '#nav' + mybodyid; 
$(mynavid).attr('id', 'active');

'id'클래스와 #nav에서 .nav까지 모두 변경해 보았지만 행운은 없습니다.

$(mynavid).addClass('active');

그러나 라인을 1로 할 확실하지 2.

HTML :

<html> 
    <body id="home"> 
    <nav id="navhome"> 
    </body> 
</html>

작업 코드를 추가 할 것입니다 내가 마지막 라인을 변경할 것 같은데요 navhome에 추가 된 "활성"ID입니다. ID 대신 클래스로 변환 된 모든 것이 필요합니다. 나는 모든 HTML id를 클래스로 바꿔야한다는 것을 알고있다. JS를 사용하여 활성 클래스를 추가 할 수 없습니다.

출처

2017-12-02 megler

HTML을 추가하십시오. –

https://jsfiddle.net/oqhp4b38/ - 귀하가 가진 것에 무엇이 잘못되었는지 보시겠습니까? 왜 ID로 뭐라도 할 필요가 있니? 당신이 보여주지 않은 HTML이 더 많지 않다면 말입니다. – ADyson

나는 자신을 잘 설명한다고 생각하지 않는다. 내가 뭘하려는 건 탐색 스타일에 활성 클래스를 추가하여 탐색 스타일을 변경합니다. 페이지로 이동할 때 클래스가 동적으로 추가되기를 원합니다. 내 문제는 jQuery에서 ID를 사용하여이를 수행하는 방법을 알고 있지만 클래스를 사용하여 작동하도록 만들 수는 없다. 내가 부트 스트랩에 있기 때문에 클래스가되어야합니다. 이미 가지고있는 것을 사용합니다. 말이 돼? – megler

ID는 고유해야하기 때문에 본문에 범위를 지정할 필요가 없습니다. 또한 ID를 재 할당하지 마십시오. .addClass을 사용하십시오.

출처

2017-12-02 19:29:07

클래스를 추가하려면 .toggleClass()을 사용하고 클래스를 추가하려면 .addClass()을 사용하십시오.

의이 내가 ID my-nav

<nav id="my-nav"> 
<ul> 
<li>menu 1 </li> 
<li>menu 2</li> 
<li>menu 3</li> 
</ul> 
</nav>

이있는 <nav>을 가지고 내가 버튼을 클릭 할 때 탐색이 .active

$("#my-nav").toggleClass('active');

위의 변경에 수업을해야한다고 가정 해 봅시다

<nav id="my-nav" class="active"> 
    <ul> 
    <li>menu 1 </li> 
    <li>menu 2</li> 
    <li>menu 3</li> 
    </ul> 
    </nav>

그는 버튼을 다시는

<nav id="my-nav"> 
<ul> 
<li>menu 1 </li> 
<li>menu 2</li> 
<li>menu 3</li> 
</ul> 
</nav>

로 변경하거나 것입니다 위의 제거해야 난 그냥

$("#my-nav").addClass('active');

출처

2017-12-02 19:30:19

나는 이것에 대해 완전한 잘못된 방향으로가는 잘못된 강제려고에 클래스를 추가하려면 코드를 내 솔루션에 추가하십시오. 여기에 내가 원했던 바가있다 :

페이지가로드 될 때, 내가 만든 페이지를 알고 코드에서 "활성"인 CSS 클래스를 해당 페이지의 탐색 링크에 추가하여 링크의 스타일을 지정할 수 있기를 바랬다. 사용자는 사이트에있는 위치를 알고있었습니다.

나는 CSS ID로이를 수행하는 방법을 알고 있었지만 클래스에서는이를 알지 못했다.

<nav> 
    <ul> 
    <li><a href="home.html">Home</a></li> 
    <li><a href="contact.html">Contact</a></li> 
    <li><a href="about.html">About</a></li> 
    </ul> 
</nav>

JQuery와 :

function(){ 
// set active link in nav 
// credit: https://www.johnmorrisonline.com/add-active-navigation-class-to-menu-item-based-on-url-using-jquery/ 
// Get current path and find target link 
var path = window.location.pathname.split("/").pop(); 

// Account for home page with empty path 
if (path == '') { 
    path = 'index.php'; 
} 
var target = $('nav a[href="' + path + '"]'); 
// Add active class to target link 
target.addClass('active');  
}

나는 그것이 작동 할 수있는 방법이있을거야 링크가 상대 및 절대하지 참고 -

HTML을 : 그 방법은 절대 URL이지만 이것은 작동합니다.

출처

2017-12-02 23:55:14 megler

jquery에서 클래스를 잡고 다른 클래스를 추가하는 방법은 무엇입니까?

답변

관련 문제