Jquery - 이미지에서 attr을 가져 와서 요소에 적용하는 데 문제가 있습니다.

Question

라이트 박스를 만들고 있는데, 지금까지이 튜토리얼을 따랐습니다. 내가 '이미지/watercolor.jpg'그때는 잘 작동하지만 난 'imghref은'링크 사용자의 href가되고 싶어요와 'imghref'을 대체 할 경우

}).attr('src', 'imghref'); 

:이 라인에 문제가있어 클릭합니다.

내 두 번째 문제는 'imghref'를 'images/watercolor.jpg'(테스트 용)로 바꾸면 페이지를 새로 고침 할 때 링크가 클릭되지 않고 이미지가 자동으로로드됩니다. ,하지만 사용자가 링크를 클릭 할 때만 이미지가로드되기를 원합니다. ARRGGG !!!!

$(function(){ 
    $('a').click(function() { 
    var imghref = $(this).attr("href"); 
    loadImage(); 
    return false; 
    }); 
}); 


$(function loadImage() { 
    var img = new Image(); 
    $(img).load(function() { 
     $(img).hide(); 
     $('#loader').removeClass('loading').append(img); 
     $(img).fadeIn('slow'); 
    }).error(function() { 

    }).attr('src', 'imghref'); 

}); 

Answer 1

처럼 그것을 할 .. 변수의 내용을 당신이 따옴표에서 그것을 포장하기 때문에, 텍스트로 실제 'imghref'을 할당하고 있지 않습니다 변수를로드 함수에 전달하고 문자열 상수 대신 변수로 사용하십시오. 또한 전역 범위에서 loadImage를 선언하거나 사용 된 범위와 동일한 범위를 선언해야합니다.

$(function(){ 
    $('a').click(function() { 
     var imghref = $(this).attr("href"); 
     loadImage(imghref); 
     return false; 
    }); 

    function loadImage(href) { 
     var img = new Image(); 
     $(img).load(function() { 
      $(img).hide(); 
      $('#loader').removeClass('loading').append(img); 
      $(img).fadeIn('slow'); 
     }).error(function() { 

     }).attr('src', href); 

    } 
}); 

Answer 2

당신은

이

.attr('src', imghref)

Answer 3

'imghref'를 loadImage()에서 문자열 상수로 사용하고있는 것으로 보입니다. 따옴표를 사용하지 않고 대신 변수 값을 사용하십시오.

$('a').click(function() { 
    var imghref = $(this).attr("href"); 
    loadImage(); 
    return false; 
}); 

$(function loadImage() { 
    var img = new Image(); 
    $(img).load(function() { 
     $(img).hide(); 
     $('#loader').removeClass('loading').append(img); 
     $(img).fadeIn('slow'); 
    }).error(function() { 

    }).attr('src', imghref); 

});