내 jQuery가 실행되지 않는 이유는 무엇입니까?

프로젝트 용 증언 로테이터를 만들기 시작했습니다. 이상하게도 충분히 라이브가되기 전에 파산했고 (이전에 테스트를 마쳤습니다) 동일한 작업을 수행하기 위해 스크랩하고 새 스크립트를 작성하기로 결정했습니다. 저는 상대적으로 jQuery에 익숙하지 않으며 3 진수 연산자를 사용하는 데 익숙하지 않지만 그걸 제공하고 싶습니다.내 jQuery가 실행되지 않는 이유는 무엇입니까?

아래 코드는 내가 작업하고있는 코드입니다. 이 코드가 제대로 실행되어야한다는 것은 제 믿음입니다. 그러나 새로운 .html 문서로 전체 내용을 복사하는 경우에는 그렇지 않습니다.

내가 얻을 수있는 도움이 필요하십니다. 저는 항상 개발자로서 성장하려고 노력하고 있습니다. 저는 결과를 얻기 위해 맹목적으로 복사하여 붙여 넣기 만하는 것이 아닙니다. 나는 무슨 일인지 알고 싶다 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 

    <title>Rotator Testing</title> 

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 

    <style type="text/css"> 
     #testimonials{ 
      width:300px; 
      height:100px; 
      background:#666; 
      position:absolute; 
      top:0;left:0; 
     } 
     .testimonial{ 
      color:#CCC; 
      display:block; 
      width:200px; 
      height:30px; 
      background:#333; 
      position:absolute; 
      left:0;top:0; 
      z-index:5; 
     } 
     .show{ 
      z-index:10; 
     } 
    </style> 

    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $('.testimonial').css({opacity: 0.0}); 
      $('.testimonial:first').css({opacity:1.0}); 
      setInterval(function(){ 

       var current = ($('#testimonials .testimonial.show')? $('#testimonials .testimonial.show') : $('#testimonials .testimonial:first')); 
       var next = current.next().length ? $('#testimonials .testimonial:first') : current.next(); 

       //Set the fade in effect for the next testimonial, show class has higher z-index 
       next.css({opacity: 0.0}) 
       .addClass('show') 
       .animate({opacity: 1.0}, 1000); 

       //Hide the current testimonial 
       current.animate({opacity: 0.0}, 1000) 
       .removeClass('show'); 


      },2000); 
     }); 
    </script> 



</head> 

<body> 

    <div id="testimonials"> 
     <article class="testimonial">Testimonial 1</article> 
     <article class="testimonial">Testimonial 2</article> 
     <article class="testimonial">Testimonial 3</article> 
     <article class="testimonial">Testimonial 4</article> 
    </div> 

</body> 
</html>

출처

2011-08-30 Tyler Willingham

"제대로 작동해야하지만 작동하지 않아야합니다"는 예상했던 것과 실제 동작이 어떻게 다른지에 대한 끔찍한 설명입니다. 당신이 사용자로부터받은 버그 보고서를 받아 들일 수 있습니까? –

http://jsfiddle.net/4adTQ/ – qwertymk

여기에 nudge가 있습니다. http://jsfiddle.net/4adTQ/1/ – qwertymk

var current = ($('#testimonials .testimonial.show')? $('#testimonials .testimonial.show') : $('#testimonials .testimonial:first'));

jQuery를이 항상 (셀렉터의 모든 요소와 일치하지 않는 경우에도) 당신의 상태를 객체를 반환합니다

$('#testimonials .testimonial.show')

. 항상 진리 일세.

확인 대신 길이 :

var current = ($('#testimonials .testimonial.show').length) 
        ? $('#testimonials .testimonial.show') 
        : $('#testimonials .testimonial:first');

다음 호 :

var next = current.next().length ? $('#testimonials .testimonial:first') : current.next();

난 당신이 전환해야 같아요

는 현재

var next = (!current.next().length) 
      ? $('#testimonials .testimonial:first') 
      : current.next();

당신이를 선택 .next()가 비어 있으면.

출처

2011-08-30 01:14:14

+1, 올바른 일을하기 위해서 그는'var next'에 대한 삼항 식을 뒤집을 필요가 있습니다. –

여러분 께 감사드립니다.이 문제를 해결 한 것으로 보이는 도움에 감사 드리며 다음에이 접근 방법을 알고 있습니다. :) –

내 jQuery가 실행되지 않는 이유는 무엇입니까?

답변

관련 문제