JavaScriptが2回実行されています

Question

私は学校用の小さなアプリケーションを開発しなければならず、最初はPhotoshopで少し設計してhtmlに変換しました。それはすべてうまくいった。私はjavascriptでカスタムドロップダウンを作成し、スムーズに動作しました。私はCodeIgniterをデザインに実装しようとしましたが、javascriptは2回実行されました。

普通のHTMLバージョンのコードとcodeigniterの結果を比較しようとしましたが、違いは見当たりません。

お手伝いできますか？ ここでCodeIgniterの結果です：ここKrof Drakulaで尋ねたよう http://intellia.itforit.net/index.htm

は、コードの最も重要な部分です：

実際のjQueryプラグイン：ここ（styleForm.js）

;(function($){ 
    $.fn.styleForm = function() { 
     var form = this; 

     /* Select */ 
     $('select', this).each(function(){ 
      var div = '<div class="styledSelect"><ul>'; 
      var first = false; 

      $('option', this).each(function(){ 
       var cssclass = ""; 
       if(!first) { 
        first = true; 
        cssclass = 'class="first"' 
       } 
       div += '<li ' + cssclass + ' id="' + $(this).attr("value") + '">' + $(this).text() + '</li>'; 
      }); 

      div += '</ul></div>'; 
      $(this).hide(); 
      $(this).after(div); 
     }); 

     $('.styledSelect ul').toggle(function(){ 
      $('li:not(.first)', this).show("fast"); 
     }, function(){ 
      $('li:not(.first)', this).hide("fast"); 
     }); 

     $('.styledSelect ul li:not(.first):not(.selected)').click(function(){ 
      var id = $(this).attr('id'); 
      var content = $(this).text(); 
      $('.styledSelect ul li.first').attr('id', id).text(content); 
      $('.styledSelect ul li').css({'font-weight': 'normal'}); 
      $(this).css({'font-weight': 'bold'}); 

      /* SELECT in Select form item */ 
      var selected = $('select option[value="' + id + '"]:not(.first)', form).get(0); 
      selected.setAttribute("selected", "selected"); 
      //$(form).submit(); 
     }); 

    }; 
})(jQuery); 

とはどこですそれが起動されます：（canvasDrawing.js）事前に

$(document).ready(function(){ 
    $('form').styleForm(); 
    //Unimportant canvas stuff 
}); 

ありがとう、 Duckness

Answer 1

canvasDrawing.jsが「重要でないキャンバスのもの」にあると、javascriptエラーが発生するという問題があります。それが記述するキャンバスが実際に存在する場合、あなたのstyleFormは一度だけ実行されます。あなたのHTMLにこれを追加してください：

 <canvas id="floorplan"></canvas> 

魔法が発生します。それとも、あなたのcanvasDrawingファイルで、styleForm後にこの権利のような句を追加します。

var canvas = document.getElementById('floorplan'); 
if (!canvas) 
    return; 

私は実際にすべてのことは明らかではないよ、その関数は、それが二回実行するようになり、それは間違いなく問題だでエラーを持つ理由。参照：your code + a canvas element = working