2010-03-30 5 views
3

작동하는 표시/숨기기 효과가 있지만 페이지에서 여러 번 사용할 수 있어야합니다. 현재 모든 요소를 ​​토글합니다. 그것을하는 방법을 내 머리를 얻을 수 없습니다.jquery는 여러 인스턴스에서 작동하도록 토글합니다

희망 하시겠습니까?

http://pastebin.me/29328e556caf53e9a1925030d65b864b

+0

요소를 표시하고 숨기는 방법에 대한 코드를 게시 할 수 있습니까? –

+1

바로 'paste code'를 클릭하십시오. – mark

+0

그냥 fyi 나는 이미 당신에게이 동일한 문제에 대한 이전 게시물의 각 루프에 대해해야만한다고 말했었습니다. – mcgrailm

답변

2

당신은 indepdently 각 <ul> 작업 것, 조금이에 기능을 편집 할 수 있습니다

$('.facet ul').each(function() { 
    if($(this).children('li:gt(9)').hide().length === 0) return; 
    $(this).append(
    $('<li id="toggler">More</li>').toggle(function() { 
     $(this).text('Hide').siblings().show(); 
    }, function() { 
     $(this).text('More').siblings('li:gt(9)').hide(); 
    })); 
});​ 

See a working demo here

을하기 전에, 그것은 어떤 li 9 이상을 얻고 있었다, 이 작업을 수행하려는 경우 <ul> 요소의 경우 위의 예와 같이 .each()입니다.

+0

Gotcha. 훌륭한. 이제이 확장 메뉴 코드를 아래에 통합해야합니다 - 새로운 질문을 만들어야합니까? http://pastebin.me/03b685f586fef84193b5fd72e815255d – mark

+0

@mark - 미래의 Google 직원이이 정보를 찾도록하기 위해 여기에 나와있는 정보를 입력하십시오. 아무도 곧 응답하지 않으면 답변을 드리겠습니다. –

+1

을 입력하십시오. 아직 2 개의 URL을 게시 할 수는 없지만. – mark

0

단순화하기 위해 몇 비트가 제거되었지만 작동하는 구현을 보려면 여기를 참조하십시오 ... 토글 러를 li 요소로 유지하려면 형제 요소를 선택적으로 숨기려면이 옵션을 확장해야합니다. 간명의 팬, 그래서 당신이 표시/숨기기를 원하는 요소 외부 togglers 유지 제안거야.

http://pastebin.me/7a7e139da8cad2b01593d895b668c17e

+0

이것은 원래 스크립트가 한 일을 전혀하지 않습니다 ... 그는 "모두"가 아니라 "더"를 숨기거나 표시하려고합니다. –

+0

예, 특정 숫자를 넘으면 'more'가 표시됩니다. 그리고 그것이 적다면. 그리고 확장 메뉴 안에서이 작업을 수행하십시오. 기본적으로 http://mikeyburton.com/과 같은 전형적인 indexhibt CMS 사이트를위한 공간 보호기 – mark

관련 문제