2011-02-02 5 views
1

EDIT#2:WP:https://wordpress.stackexchange.com/questions/5683/loading-dynamic-content-with-ajax-breaking-jqueryを除いて、これはまさに私と一緒に起こっていることです。私はどのように私のスクリプトでこれを行うだろうか?ajax呼び出しがjqueryを壊すのはなぜですか?

EDIT:実際の問題は、ページを読み込むとうまく動作し、ajaxが呼び出されていないことです。しかし、いったんそれが呼び出されます。残りのスクリプトはすべて停止します。 ajax呼び出し後にスクリプトを再実行するにはどうすればよいですか?私はFirebug Consoleからこれを確認しました。以下の問題も、私は本当にこのmewith助けるために誰かのために懇願していて...

みんなを引き起こしている可能性がありますされて、私は

ゴー hereこの固定:(

を必要とする「現在のプロジェクト」を見セクションとリンクのリストと定義ボックス

ナビゲーションでは、別のページをクリックしてから帰宅します。「Current Projects」セクション全体が壊れています。 JS)、スクロールバーも壊れています。

これは、ajaxが元のdivの隣に別のdivを読み込んでいるためにサイトが破損するためだと思います。

例:ページのロードで

<div id="main-content"> 
..content... 
</div> 

<div id="main-content" class="home"> 
<div id="main-content" class="home"> 
    ..content... 
</div> 
</div> 
を返し、その後、別のページにクリックした後、

これをどうやって止めるのですか?

のjQuery:現在のプロジェクトのセクションに関連

$dd = $('.projects dl').find('dd'), $defBox = $('#def-box'); 

    $defBox.hide(); 
    $('.projects').hover(function(){ 
    $defBox.stop(true, true) 
     .fadeToggle(1000) 
     .html('<p>Hover The links to see a description</p>'); 
    }); 

    $dd.hide(); 
    $('.projects dl dt').hover(function(){ 
    var $data = $(this).next('dd').html(); 
    $defBox.html($data); 
    }); 

アヤックス

// Ajax Stuff 
    // Check for hash value in URL 
    var hash = window.location.hash.substr(1); 

    // Check to ensure that a link with href == hash is on the page 
    if ($('a[href="' + hash + '"]').length) { 
    // Load the page. 
    var toLoad = hash + '.php #main-content'; 
    $('#main-content').load(toLoad); 
    } 
$('nav ul li a').click(function(){ 
    var goingTo = $(this).attr('href'); 
    goingTo = goingTo.substring(goingTo.lastIndexOf('/') + 1); 
    if (window.location.hash.substring(1) === goingTo) return false; 

    var toLoad = $(this).attr('href')+' #main-content', 
    $content = $('#main-content'), $loadimg = $('#load'); 

    $content.fadeOut('fast',loadContent); 
     $loadimg.remove(); 
     $content.append('<span id="load"></span>'); 
     $loadimg.fadeIn('slow'); 
    window.location.hash = goingTo; 

    function loadContent() { 
     $content.load(toLoad,'',showNewContent) 
    } 
    function showNewContent() { 
     $content.fadeIn('fast',hideLoader); 
    } 
    function hideLoader() { 
     $loadimg.fadeOut('fast'); 
    } 
    return false; 

    }); 

今、私はそれが問題だと思う、私はわからないんだけど、誰でも助けることができますか?

答えて

0

これは実際にあなたの問題であるようです。あなたは挿入するために使用する親コンテナにそのコンテンツを入れるか、home.phpのメインコンテンツの子コンテナを挿入する必要があります

コンテナを入れたくないこれは、ページをリフレッシュせずに再帰的に発生し続けるためです。

1

jQueryのロード関数に渡すセレクタを改良して、main-contentの子をそれ自身ではなく#挿入するという解決策があるとします。

は、たとえば、あなたは <div id="main-content"><div id="main-content-wrapper">...のような#メイン・コンテンツにラッパー要素を置くことができ、その後 $(this).attr('href')+' #main-content-wrapper'にあなたのAJAX URLを変更します。

$(this).attr('href')+' #main-content > *'を使用すると、ラッパー要素を必要とせずに動作する可能性があります。

+0

何もしません:( – nowayyy

+0

ajaxコンテンツセレクタを変更していないようです: var toLoad = $(this).attr( 'href')+ '#main-content''to' to var toLoad = $これは).attr( 'href')+ '#メインコンテンツラッパー' ' と: 'var toLoad = hash +' .php#main-content''から' var toLoad = hash + '.php #main -content-wrapper'' そしてすべてのページにラッパーdivを入れてください –

+0

隠されたdivにコンテンツを読み込み、#main-contentを読み込まれたコンテンツに置き換える方が簡単かもしれないことは知っています。 –

1

ページロード時にtinyscrollbarプラグインを適用しています。ホームページに戻ると、tinyscrollbarプラグインをもう一度再適用する必要があります。

uはuはuが家(http://static9.me/clients/witza/#home)をクリックすると、再びこのスクリプトを実行する必要があるウルはhttp://gyazo.com/038351a0773b519c3bb36ff6952dacfa.pngをやって、ページ(http://static9.me/clients/witza/)をロード

uがロードするとき#homeのないページ、ホームコンテンツを取得するためのajaxリクエストはありませんか?スクリプトはページのフッターにあります。うまく動作します。ホームをクリックするとURLは...#homeになり、ajaxでホームコンテンツがロードされます。そのプラグインを再度適用する必要があります。ナビゲーションのホームリンクをクリックして、ur consoleでtinyscrollbarスクリプトを実行してみてください。 uがここで私は

0

言いたいことが表示されますソリューションです。

http://jsbin.com/uhuci5/2/

は、あなたがやろうとしている他の方法で、このようなウルのコードを書いていません。

関連する問題