버튼을 클릭하면 setInterval + image src가 변경됩니다.

Question

버튼을 클릭 할 때 깜박임 효과 (어둡고 가벼운)를주고 싶습니다. 다음 코드를 작성했지만 작동하지 않습니다. 제발 도와주세요.

$(document).ready(function() { 

    $(".search").click(function() { 
     setInterval(function() { 
      var curSrc = $("#red").attr('src'); 

      if (curSrc === '../images/lightred.jpg') { 
       $(curSrc).attr("src", "../images/Darkred.jpg"); 
      } 
      if (curSrc === '../images/Darkred.jpg') { 
       $(curSrc).attr("src", "../images/lightred.jpg"); 
      } 
     }, 2000); 
    }); 

}); 

Answer 1

curSrc은 소스 속성입니다,하지만 당신은 객체하지 않습니다 그, jQuery를에 포장하기 위해 노력하고 있습니다.

if (curSrc === '../images/lightred.jpg') { 
      $("#red").attr("src", "../images/Darkred.jpg"); 
} 
if (curSrc === '../images/Darkred.jpg') { 
      $("#red").attr("src", "../images/lightred.jpg"); 
} 

Answer 2

질문이 버튼 깜박임을 만드는 방법을 수 있습니다 같다 : 다시 #red을 대상으로 다음 소스를 설정해야합니다. 이것은 css background-color 속성을 사용하여 수행 할 수 있습니다. lightRed 및 darkRed가 단색 인 경우 CSS가 더 적합합니다. 이미지가 필요한 경우 background-image 속성을 사용할 수 있습니다.

<input type="button" class="search lightRed" value="Search"/> 
<style> 
    .lightRed { background-color: lightcoral } 
    .darkRed { background-color: darkRed } 
</style> 
<script> 
    $(document).ready(function(){ 
     $(".search").click(function(){ 
      setInterval(function(){ 
       var isLightRed = $(".search").hasClass("lightRed"); 
       if (isLightRed) { 
        $(".search").removeClass("lightRed").addClass("darkRed"); 
       } else { 
        $(".search").removeClass("darkRed").addClass("lightRed"); 
       } 
      },2000); 
     }); 
    }); 
</script>