1

如果这是一个头脑简单的问题，请见谅。

我的应用程序中嵌入了如下所示的 jQuery 脚本：

   <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>

我的老板刚刚告诉我把这个 jQuery 放在 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);
                }
            });
            */      
      }


     //<![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();
       });

       });//]]>

但现在它不再起作用了。

它应该显示和隐藏某些图标。

我究竟做错了什么？

4

2 回答 2

2

几件事。首先删除<script>和CDATA标签。它们在外部 javascript 文件中不是必需的（可能包含<script>在 HTML 中的标记中）。

其次，你需要用$(document).ready(). 您可能在当前 HTML 的底部（或至少在它绑定到的 HTML 元素之后）有这个 javascript，并且由于这个外部 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>
于 2013-02-08T16:13:05.613 回答
1

您想在文件中包含您的 Javascript 吗？

假设之前已经包含了 jQuery：

html

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

包含.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);    
      }
于 2013-02-08T16:10:15.223 回答