1

外部の JavaScript ファイルを動的にロードし、スクリプトのメソッドを DOM の特定の要素にバインドできるようにしたいと考えています。それは可能ですか?どのように?どのような制約がありますか?

解決策は次のようになると思いますが、機能するものなら何でも受け入れます。

<html><body>
  <div class="A">aaaaa</div>
  <div class="B">bbbbb</div>
  <div class="A">aaa</div>
</body></html>

<script type="text/javascript">
  //This is the internal script, part of the original page
  $.get("url/outside_script.js",
    function(script_obj){
      $(".A").bind('niftyMethod', script_obj.niftyMethod)
    }
  );
</script>

外部スクリプトは次のとおりです: outside_script.js

<script type="text/javascript">
  var script_obj = {
    niftyMethod : function(){
      //Do cool stuff in the context of a DOM object.
      $(this).fadeOut(500,function(){$(this).fadeIn(500)});
  }
</script>

私はこれについてグーグルでかなりのことをしましたが、あまり見つかりませんでした。もしかして検索ワード間違ってる…?

注: 必要であれば jquery を喜んで使用します。

4

1 に答える 1

0

いくつかの修正:

脚本:

<script type="text/javascript">

    //add script to page
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = "url/outside_script.js";
    $('body').append(script);

    //on document ready, bind your function
    $(function(){
        $(".A").bind('click', script_obj.niftyMethod)
    });

</script>

外部ファイル:

var script_obj = script_obj || {
    niftyMethod : function(){
      //Do cool stuff in the context of a DOM object.
      $(this).fadeOut(500,function(){$(this).fadeIn(500)});
  }
于 2012-04-27T03:41:09.973 に答える