2012-03-19 7 views
-1

私は、ページ(Aページ)を作成して、既存のページ(Bページ)に動的に(Web上の外部ページを作成しないように)ロードする方法を探しています。目標は、ページBのJavascript/jqueryでページAの動作に影響を与えることです。 例:pageAのボタンをクリックすると、ページBのJavascriptがこれに反応します。 。jQueryを使ってHTMLコンテンツをロードする

は、私は()jQueryの$を使ってこれを実現しようとした負荷()関数が、これは私がページAからページBのJavaScriptを呼び出すことはできませんしました

具体的なコード: 私のページBには、この含まれています

jQuery(document).ready(function() { 
    jQuery('#mycarousel').jcarousel({ 
     initCallback : carousel_callback 
    }); 
}); 

をそして私は、このタブにページ(ページA)からカルーセルと負荷のコンテンツに新しいタブを追加する機能を持っています。

$('.ref').click(function() { 
     var newTabId = jQuery('#mycarousel').jcarousel('size') + 1; 
     carousel 
       .add(
         newTabId, 
         "<li style='width: 50%;'><div id='tab" + newTabId + "' style='height: auto;'></div></li>"); 
     // load content 
     $("#tab" + newTabId).load("/researchPad" + $(this).attr('id')); 
    }); 

これは静的コンテンツ(これはカルーセルに静的タブがある場合)に有効です。これは、動的に追加されるタブでも機能したいと思っています。

提案された反応の1つとして、JavaScriptを別のファイルに入れて、このスクリプトにロードされるページとしてメインページをリンクしてみました。しかし、これは彼らが文脈を共有することはありません。 jQueryのドキュメントからロード用():

は「jQueryの検索された文書を解析し、現在のドキュメントに挿入するには、ブラウザの.innerHTMLプロパティを使用しています

+2

両方のページに同じJavaScriptを含めないのはなぜですか? – jrummell

+0

私はより具体的な質問をするつもりです(現時点では例を示すことはできません)。ページBにはロードされたページを保持するjCarouselが含まれています。ページAにおいてボタンがクリックされると、新しいコンテンツがロードされるカルーセルに新しいタブが追加されるべきである。だから、私はページBのjavascript関数を必要としないだけでなく、コンテキストも必要です。だから、私はページAのページBのJavaScriptのコンテキストを参照する方法を探しているのです。 – user485659

+0

HTML(コンテキスト)を '$ .load()'で読み込み、両方で同じjsを参照してくださいページ。いくつかのコードを見ることなく、あなたがしようとしていることを正確に理解するのは難しいです。 – jrummell

答えて

0

は、私は、これはそれとは何かを持っているかもしれないと思われます。このプロセスでは、ブラウザは多くの場合、< html>、< title>、または< head>要素のような要素から文書をフィルタリングします。その結果、.load()によって取得された要素は、ブラウザによって直接検索されます。

ページBのJavaScriptはどこにありますか?頭の部分で?

0

jQueryには、JavaScriptを動的にロードするための別の方法があります。

ような何か、ページBに、次に、ページC.ページAからあなたのインラインコードを削除し、外部のJavaScriptファイルに置き、それを呼び出す:私は賭けて喜ん、言っ

$.load('pageA.html', function(data) { 
    $.getScript('pageC.js'); 
}); 

をそれは.live DOM要素に作用するので、あなたは、ページCのコードを書き換えることによりgetScriptを完全に排除することができます、そしてあなたがあなたのページを.LOAD

+0

提案してくれてありがとうが、それはまさに私が意味するものではない。私は元の質問の正確な問題を説明しました。 – user485659

0

後にページBの<head>における通常の方法でロードpageC.jsは、再バインドを試してみてくださいあなたの出来事。例えば、これを行うと、.loadでロードされたボタンに影響はありません。

$(button).click(function(){blabla}) 

あなたのイベントを関数にバインドし、.load finishesの後で呼び出すことをお勧めします。しかし、二重実行のために既存のバインディングをアンバインドすることを忘れないでください。

関連する問題