2012-06-18 3 views
0

나를 위탁 할 수는 있지만 제품보기 페이지가 있고 상단에 h1 태그의 제품 이름이 있는지 확실하지 않습니다.Magento - 클릭시 이미지 레이블 표시

각 제품은 즉 다시, 자신의 색으로 레이블이 첨부 이미지, 상아의 선택을했다 burgandy 등 등 내가 다음과 같이 제품 이름을 표시 할

:

제품 이름 | 색깔

나는 첫번째 (defualt) 심상을 위해 일어날 것을 처리했다. 당신이 상품 페이지로 갈 때

그래서 이름입니다 :

알바니 | 블랙 (내가 원하는대로 정확하게)

당신이 변경 제품 이름 (이미지입니다) 다른 색상 옵션을 클릭하면 내가 지금 원하는 :

알바니 | 아이보리 알바니 | Burgandy 알바니 | 초콜릿 등 기타

나는 일정한 도움을 받았지만 지금은 붙어 있습니다.

나는 다음과 같은 inclide하는 주제 수 fo script.js 파일을 변경하는 것이 좋습니다되었습니다

$('.more-views a').click(function(){ 
$('#label').text($('img', this).attr('alt') ); }); 

코드를 나는 다음과 같이 내 H1 태그가 주변의 한 :

<div class="product-name"> 
      <h1><?php echo $_helper->productAttribute($_product, $_product->getName(), 'name') ?> 
      <span id="label"><?php echo ' | ' ?><?php echo $_product->getData('image_label');?></span></h1> 
     </div> 

하는 경우 아무도 내가 이것을 어떻게 성취 할 수 있는지 전혀 알지 못한다. 나는 그것을 정말로 고맙게 생각할 것이다.

미리 감사드립니다.

해당 페이지에 대한 링크는 여기에 있습니다 :

http://dansiop.com/yarwood/index.php/albany.html

+0

'img'태그의 'HTML'이 손상된 것을 볼 수 있습니다. 모든 이미지의 'alt' 속성에는 값이 없습니다. 요소를 살펴보고 확인하십시오. 생성 된 'HTML'이 맞으면 코드가 작동 할 수 있습니다. –

답변

1

페이지에로드 된 여러 개의 자바 스크립트 라이브러리 (scriptaculous, prototype 및 jQuery 포함)가 있습니다. jQuery.noConflict()을 사용하고 있지 않다는 것을 알고 있다면, jQuery를 사용하도록 설정되어 있다면 $ 대신 jQuery을 사용해야 할 것입니다.

또한 jQuery 1.7 이상이로드되어 있으므로 위임자를 사용하여 처리하는 것이 좋습니다. 언급 한 바와 같이

// don't forget document ready 
jQuery(function ($) { 

    // let's cache the label 
    var _label = $('#label'); 

    $('.more-views').on('click', 'a img', function() { 
     _label.text($(this).attr('alt')); 
    }); 

}); 

, 당신은이 작업을 위해 이미지에 alt 속성에 넣어해야합니다. alt 값을 얻고 시작하는 것이 아무것도 없다면 그것을 표시하는 것은별로 의미가 없습니다.

<img src="" alt="Blue" /> 
+0

고마워, 내 alt 코드를 고쳐야 만한다고 생각해. 그건 틀렸어. 그래서 대체 코드는 echo'd되지 않았다. 일단 그것이 작동하는 반향 코드를 고정 시켰습니다. –

0
$('.more-views a').click(function(){ 
    $('#label').text($(this).find('img').attr('alt')); 
}); 

comment이 대답하기 전에 참조하시기 바랍니다.