Tempo.js : 항목을 렌더링 할 때 templated JSON 렌더링 엔진이 javascript를 실행하지 않습니다.

Question

문제 : 렌더링 된 항목이 템플리트의 일부인 JS를 실행하지 않습니다.

우리 같은 HTML을했다 :

 <div id="tabs-fun" class="fun"> 
      <ol id="marx-brothers"> 
        <div data-template> <li class="file-{{is_public}}"> <p id="item-file-{{_tempo.index}}">{{file_name}} | {{modified}} | {{_tempo.index}} </p></li> 
        <script> 
         $('#item-file-{{_tempo.index}}').mouseup(function(){ 
          alert('hello!'); 
         }); 

        </script> 
        </div> 
        <li data-template-fallback>Sorry, JavaScript required!</li> 
      </ol> 
     </div> 

그리고 우리는이 같은 JSON했다 :

[ 
    { 
     "encoded_url": "893067edfcc310c7f32657b7faf314dcb472efe808ffa5a6560cbda2c1cba0e5.user.file", 
     "file_name": "Привет Мир.jpg", 
     "user_name": "jdfg@mail.ru", 
     "modified": "2011-10-30 18:06:28", 
     "is_public": 0 
    }, 
    { 
     "encoded_url": "d1f2d21925d11931981e3bc0339d6a278e9bbd7ba9db6a96e45c9bbd9ecff0d9.user.file", 
     "file_name": "Привет Мир 2.jpg", 
     "user_name": "jdfg@mail.ru", 
     "modified": "2011-10-30 18:06:48", 
     "is_public": 1 
    } 
] 

JS와 그것을 렌더링 :

 <script type="text/javascript"> 
      $(document).ready(function() { 
       var twitter = Tempo.prepare('marx-brothers'); 
       twitter.starting(); 

       $.get("ufs.json", function(json) 
       { 
        var data = $.parseJSON(json); 
        twitter.render(data); 
       }); 
      }); 
     </script> 

을 그리고 우리는 유효한 HTML있어 페이지 :

<ol id="marx-brothers"> 

         <li data-template-fallback="" style="display: none; ">Sorry, JavaScript required!</li> 
       <div data-template=""> <li class="file-0"> <p id="item-file-0">Привет Мир.jpg | 2011-10-30 18:06:28 | 0 </p></li> 
         <script> 
          $('#item-file-0').mouseup(function(){ 
           alert('hello!'); 
          }); 

         </script> 
         </div><div data-template=""> <li class="file-1"> <p id="item-file-1">Привет Мир 2.jpg | 2011-10-30 18:06:48 | 1 </p></li> 
         <script> 
          $('#item-file-1').mouseup(function(){ 
           alert('hello!'); 
          }); 

         </script> 
         </div></ol> 

하지만 항목을 클릭하면 아무 것도 얻을 수 없습니다. 물론 내가 마우스로 다뤄야 할 JS가 아닌 것은 복잡한 일이지만이 샘플은 Tempo으로 템플릿과 JS의 일반적인 사용에 관한 것입니다.

이 문제를 해결하려면 어떻게해야합니까?

업데이트

데모 http://jsfiddle.net/79Y77/2/

Answer 1

권장되는 방법은 각 요소가 생성 될 때이 복사되지 않기 때문에 이벤트 처리기를 바인딩 jQuery를() 메소드 사는 사용하는 것입니다 여기에 제시된. '- {{_ tempo.index}} # 항목 파일' '# 항목 파일을 알려드립니다 - {{_ 템포 http://jsfiddle.net/zfJbp/1/