Cufon이 적용된 텍스트를 동적으로 변경하는 방법

Question

Cufon이 적용된 사이트에서 작업 중입니다.

<label class="option" for="edit-delivery-method-U.S.-postal-delivery"> 
    <input type="radio" id="edit-delivery-method-U.S.-postal-delivery" name="delivery-method" value="U.S. postal delivery" checked="checked" class="form-radio" /> 
    U.S. postal delivery 
</label> 

가 Cufon 후, 텍스트는 텍스트의 각 단어를 교체, 4 Cufon-> 캔버스 태그로 대체 : cufon 전에, 나는 다음과 같은 마크 업을 가지고있다.

<label class="option" for="edit-delivery-method-U.S.-postal-delivery"> 
<input type="radio" id="edit-delivery-method-U.S.-postal-delivery" name="delivery-method" value="U.S. postal delivery" checked="checked" class="form-radio"> 
<cufon class="cufon cufon-canvas" alt=" " style="width: 4px; height: 14px;"><canvas width="20" height="17" style="width: 20px; height: 17px; top: -2px; left: -2px;"></canvas><cufontext> </cufontext></cufon> 
<cufon class="cufon cufon-canvas" alt="U.S. " style="width: 25px; height: 14px;"><canvas width="41" height="17" style="width: 41px; height: 17px; top: -2px; left: -2px;"></canvas><cufontext>U.S. </cufontext></cufon> 
<cufon class="cufon cufon-canvas" alt="postal " style="width: 39px; height: 14px;"><canvas width="54" height="17" style="width: 54px; height: 17px; top: -2px; left: -2px;"></canvas><cufontext>postal </cufontext></cufon> 
<cufon class="cufon cufon-canvas" alt="delivery" style="width: 46px; height: 14px;"><canvas width="59" height="17" style="width: 59px; height: 17px; top: -2px; left: -2px;"></canvas><cufontext>delivery</cufontext></cufon> 
</label> 

이 텍스트를 클릭 이벤트에서 동적으로 변경하고 싶습니다. 텍스트를 변경하기 위해 jQuery를 사용하여 이것을 어떻게 올바르게 표적화 할 수 있는지 모르겠다. Cufon API를 여기에서 볼 때 https://github.com/sorccu/cufon/wiki/API, 나는 작동한다고 생각되는 것을 발견했지만 그것은 나를 위해 작동하지 않습니다. 여기 내 코드는 다음과 같습니다.

var usPostalOneYearLabel = $('#edit-delivery-method-U.S.-postal-delivery-wrapper label'); 
var deliveryMethod = $('input[name="delivery-method"]'); 
deliveryMethod.change(function() { 
    if(deliveryMethod.filter(':checked').val() === "U.S. postal delivery") { 
     console.log('yay!'); 
     var html = usPostalOneYearLabel.html(); 
     Cufon.replace(usPostalOneYearLabel, { 
      modifyText: function() { 
       return 'hello world'; 
      } 
     }); 
     Cufon.refresh(usPostalOneYearLabel); 
     console.log('html'); 
    } 
}); 

누군가 올바른 방향으로 나를 가리킬 수 있습니까?

Answer 1

해결책을 찾았습니다 :

먼저 : cufon 태그의 alt 속성을 대체하십시오.

<cufon class="cufon cufon-canvas" alt="Home" 

에 :

<cufon class="cufon cufon-canvas" alt="Lorem" 

둘째는 자바 스크립트 실행 : 내 경우에는

Cufon.replace('.menu-item a'); 

. (각 요소를 바꾸기 위해 applicate 할 것임)