이 jQuery 코드가 예상대로 작동하지 않는 이유는 무엇입니까?

Question

이 쿼리가 제대로 작동하지 않는 이유는 무엇입니까? 데이터 대상 속성이 다른 요소를 식별 할 수 없습니까?

JS

$('button').click(function(){ 
    // uses the button's "data-target" attribute to identify another element to toggle 
    target = $('#' + $(this).data('target')); 

    // toggles the visibility of the target 
    if (target.is(':visible')) { 
     target.slideUp(); 
    } else { 
     target.slideDown(); 
    } 

    // says goodbye if it was hidden 
    if (target.is(':hidden')){ 
     alert('goodbye, cruel world!'); 
    } 
}); 

Answer 1

데이터-속성 나던 항상 내가 문제가 될 수 있다는 결과로 원하는 걸 제공합니다. 어떤

target = $('#'+ $(this).attr('data-target')); 
console.log(target.length +' items found'); // log how many items found (should be 1) 

그것은 당신이 다른 개체의 값을 사용하려고한다는 사실이 아니다, 문자열 문자열입니다 :

console.log($(this).data('target'));// check it's value 

이 확실히 작동이 : 값이 정확한지 확인할 수 있습니다 이 (변수, 속성, 속성 값 등) 어디에서 오는 문제

Answer 2

여성용이 예와 jsfiddle입니다 http://jsfiddle.net/ravikumaranantha/sDvph/1/

이 코드 아무 문제가 없다, 마크 업과 관련된 문제 일 수 있습니다. 아래 마크 업과 함께 잘 작동합니다.

<button data-target="toggleTarget">test button</button> 
<div id="toggleTarget"> 
    <p>this is the target</p> 
    <p>this is the target</p> 
    <p>this is the target</p> 
    <p>this is the target</p> 
    <p>this is the target</p> 
    <p>this is the target</p> 
</div> 

Answer 3

기본적으로 대상이 숨겨진 경우 메시지가 작동하지 않습니다.

여기서 일어나는 일은 요소가 표시되는지 여부를 확인하는 것입니다. 그러나 요소를 숨기려면 .slideUp()을 사용합니다. 애니메이션이 완료되지 않은 경우 요소가 숨겨진 것으로 표시되지 않습니다. 애니메이션이 트리거 된 직후에 표시되는지 확인합니다 (애니메이션 완료를 의미하지는 않음). 숨기기 애니메이션이 완료된 후
은 무엇 당신이 원하는 것은 메시지

if (target.is(':visible')) 
{ 
    target.slideUp('slow', function() 
        { 
         alert('goodbye, cruel world!'); 
        }); 

} 
else 
{ 
    target.slideDown(); 
} 

jsFiddle