jQuery 스크립트를 include.js 파일에 포함시키는 방법은 무엇입니까?

Question

이것이 단순한 질문이라면 임대를 용서하십시오.

<script type='text/javascript'>//<![CDATA[ 
    $(function(){ 
    $('#div1).on('click', function() { 
     $('#divTitle').show(); 
    }); 

    $('#div1').on('click', function() { 
     $('#divTitle').slideUp(); 
    }); 
    });//]]> 

    </script> 
    <script type='text/javascript'>//<![CDATA[ 
    $(function(){ 
    $('#div2').on('click', function() { 
     $('#secDiv').show(); 
    }); 

    $('#div2).on('click', function() { 
     $('#secDiv).slideUp(); 
    }); 

    });//]]> 

</script> 

내 상사는 include.js 파일이 jQuery를 넣어 나에게 말했다 :

나는 아래 JQuery와 스크립트가 내 응용 프로그램에 포함해야합니다.

function showIcon() { 
      toggleButtonIcon('[Widget dijit.form.ToggleButton, pan]'); 
      navToolbar.activate(esri.toolbars.Navigation.PAN); 
      /*dijit.registry.byClass("dijit.form.ToggleButton").forEach(function(togbtn) {   
       if (togbtn == '[Widget dijit.form.ToggleButton, pan]') { 
        togbtn.attr("checked", true); 
       } 
       else 
       { 
        togbtn.attr("checked", false); 
       } 
      }); 
      */  
     } 


    //<![CDATA[ 
     $(function(){ 
     $('#div1).on('click', function() { 
      $('#divTitle').show(); 
     }); 

     $('#div1').on('click', function() { 
      $('#divTitle').slideUp(); 
     }); 
     });//]]> 

     <![CDATA[ 
     $(function(){ 
     $('#div2').on('click', function() { 
      $('#secDiv').show(); 
     }); 

     $('#div2).on('click', function() { 
      $('#secDiv).slideUp(); 
     }); 

     });//]]> 

아래에 표시하지만 지금은 더 이상 작동하지 않습니다으로

나는 파일을 포함.

특정 아이콘을 표시하거나 숨기기로되어 있습니다.

내가 뭘 잘못하고 있니?

Answer 1

파일에 자바 스크립트를 포함 시키시겠습니까?

HTML을

<script type="text/javascript" src="path/to/include.js"></script> 

include.js

jQuery(function($){ 
     $('#div1').on('click', function() { //missing ' 
      $('#divTitle').show(); 
     }); 

     $('#div1').on('click', function() { 
      $('#divTitle').slideUp(); 
     }); 


     $('#div2').on('click', function() { 
      $('#secDiv').show(); 
     }); 

     $('#div2').on('click', function() { //missing ' here 
      $('#secDiv').slideUp(); //missing ' here too 
     }); 

    }); 

    //Edit omitted this part 
    function showIcon() { 
     toggleButtonIcon('[Widget dijit.form.ToggleButton, pan]'); 
     navToolbar.activate(esri.toolbars.Navigation.PAN);  
     } 

Answer 2

몇 가지 : jQuery를 가정

이전을 포함하고있다. 먼저 <script> 및 CDATA 태그를 삭제하십시오. 외부 자바 스크립트 파일에는 필요하지 않습니다 (아마도 HTML의 <script> 태그에 포함될 것입니다).

둘째, $(document).ready()으로 자바 스크립트를 래핑해야합니다. 아마도이 자바 스크립트를 현재 HTML의 맨 아래에 (또는 적어도 바인딩하려는 HTML 요소 뒤에) 가지고있을 것이고,이 외부 JS 파일은 헤더에로드 될 가능성이 높기 때문에 HTML 요소는 바인딩 할 대상이 아닙니다.

새로운 include.js :

function showIcon() { 
     toggleButtonIcon('[Widget dijit.form.ToggleButton, pan]'); 
     navToolbar.activate(esri.toolbars.Navigation.PAN); 
     /*dijit.registry.byClass("dijit.form.ToggleButton").forEach(function(togbtn) {   
      if (togbtn == '[Widget dijit.form.ToggleButton, pan]') { 
       togbtn.attr("checked", true); 
      } 
      else 
      { 
       togbtn.attr("checked", false); 
      } 
     }); 
     */  
    } 

    $(document).ready(function() { 

    $(function(){ 
     $('#div1).on('click', function() { 
      $('#divTitle').show(); 
     }); 

     $('#div1').on('click', function() { 
      $('#divTitle').slideUp(); 
     }); 
    }); 

    $(function(){ 
     $('#div2').on('click', function() { 
      $('#secDiv').show(); 
     }); 

     $('#div2).on('click', function() { 
      $('#secDiv').slideUp(); 
     }); 
    }); 

    }); 

또한 당신이 당신의 HTML 파일에 이런 일이 있는지 확인 :

<script type="text/javascript" src="path/to/include.js"></script>