アドレス状態混乱

Question

私はjQueryのアドレスを使用して、簡単なディープリンクのページを構築し、この例を次に示します。
今 http://www.asual.com/jquery/address/samples/state/

この例では、HTML5のブラウザは、（私はクローム10使用）実際に表示されるソースを示しています。私。 http://www.asual.com/jquery/address/samples/state/portfolioは、content divにPortfolio content.を示します。ただし、その内容はJquery address/Ajax/$('.content').html()で挿入されています。私はこの例を再構築しましたが、私のページでは、Ajaxが実行される前のソースは常に最初のページの1つです。これは、HTML5以外のブラウザと同じ動作です。
何が間違っていますか？ヒントのための
おかげで、
トーマス

編集：

<script type="text/javascript"> 

     $.address.init(function() { 

      // Initializes the plugin 
      $('.nav a').address(); 

     }).change(function(event) { 

      // Selects the proper navigation link 
      $('.nav a').each(function() { 
       if ($(this).attr('href') == ($.address.state() + event.path)) { 
        $(this).addClass('selected').focus(); 
       } else { 
        $(this).removeClass('selected'); 
       } 
      }); 

      // Handles response 
      var handler = function(data) { 
       $('.content').html($('.content', data).html()).show(); 
       $.address.title(/>([^<]*)<\/title/.exec(data)[1]); 
      }; 

      // Loads the page content and inserts it into the content area 
      $.ajax({ 
       url: $.address.state() + event.path, 
       error: function(XMLHttpRequest, textStatus, errorThrown) { 
        handler(XMLHttpRequest.responseText); 
       }, 
       success: function(data, textStatus, XMLHttpRequest) { 
        handler(data); 
       } 
      }); 
     }); 

     // Hides the tabs during initialization 
     document.write('<style type="text/css"> .content { display: none; } </style>'); 

    </script> 

マインズいつも同じ：

ここでデモコードです。リンクの強調表示を削除し、URLを自分のサイトに合わせて変更し、htmlを読み込んでいるのでAjax呼び出しを変更しました。ドキュメントに実際には言及していないが、プロジェクトのGitHubで見つけた必要な.htaccessのように、「もっと何か」があるのだろうかと思います。

は、ここに私のコードです：あなたはセットアップに私たちは見てのデモを持っているかどう

$.address.init(function(event) { 
     $('#blogMenu a').address(); 
     $('#blogBottomMenu a').address(); 
     $('.linkleiste a').address(); 
}).change(function(event) { 
     var value = $.address.state().replace(/^\/$/, '') + event.value; 
    value = value.replace(/^\/blog\//,''); 
    value = value.replace(/_/,''); 
     var teile = value.split('/'); 
     var name = ''; 
     var thema = ''; 
     if(teile[0]) name = teile[0]; 
     if(teile[1]) thema = teile[1]; 
     $('#blog').hide(); 
      if(!value.match(/ADFRAME/)) { 
       $(document).scrollTo('#aufmacher','fast'); 
       $('#blogMenu').load('/snp/blog_menu.snp',{A_NAME:name,ETIKETT:thema,id:id}); 
       $('#blog').load('/blog/article.snp',{A_NAME:name,ETIKETT:thema,id:id},function() { 
        $('#blog').show(); 
       }); 
      } 
      else { 
       $('#blog').fadeIn('fast'); 
      } 

    }); 

Answer 1

それは、より参考になります。しかし、あなたのコードを見ることで、すべてがロードされる前にイベントをトリガする必要があります。

$(function() { // NOT $(document).ready(function() {}); 
    $.address.init(); 
}); 

ハッシュがない場合は、ハッシュ変更をトリガーする必要があります。

$(function() { 
    $.address.init(); 
    $.address.change(); // Triggers hash change when there is no hash! 
}); 

コードを見ると、あなたのレイアウトと違うレイアウトが使用されているように見えます。

var init = true, 
state = window.history.pushState !== undefined; 

// Handles response 
var handler = function (data) { 
    $('title').html($('title', data).html()); 
    $('.content').html($('.content', data).html()); 
    $('.page').show(); 
    $.address.title(/>([^<]*)<\/title/.exec(data)[1]); 
}; 

$.address.state('/jquery/address/samples/state').init(function() { 

    // Initializes the plugin 
    $('.nav a').address(); 

}).change(function (event) { 

    // Selects the proper navigation link 
    $('.nav a').each(function() { 
     if ($(this).attr('href') == ($.address.state() + event.path)) { 
      $(this).addClass('selected').focus(); 
     } else { 
      $(this).removeClass('selected'); 
     } 
    }); 

    if (state && init) { 

     init = false; 

    } else { 

     // Loads the page content and inserts it into the content area 
     $.ajax({ 
      url:$.address.state() + event.path, 
      error:function (XMLHttpRequest, textStatus, errorThrown) { 
       handler(XMLHttpRequest.responseText); 
      }, 
      success:function (data, textStatus, XMLHttpRequest) { 
       handler(data); 
      } 
     }); 
    } 

}); 

if (!state) { 

    // Hides the page during initialization 
    document.write('<style type="text/css"> .page { display: none; } </style>'); 
} 

デモを設定すると、回答が更新されます。