奇怪的鏈接行爲

我基本上是新的jQuery的，所以我不知道我沒有做我想做什麼是最好的方式......奇怪的鏈接行爲

我想使用AJAX加載網頁內容，並使得使用#!重寫URL永久的URL，它的工作原理除了一些鏈接好...

這裏頁面的預覽短（整個頁面/ CSS/JS HERE），在<div id="undertop">工作良好的聯繫，但其他<div id="listlabel">沒有工作，我不明白爲什麼...

HTML

<div id="undertop"> 
     <a class="undertop" href="#!/news/Running">Home</a> 
</div> 
<div id="container">  
<div id="blog"> 
    <div class="post">          
     <a href="blablabla">Read More...</a>                
    </div> 
</div>   
<div id="listlabel"> 
     <a class="labelbox" href="#!/news/Running">Running (10)</a><br><br><br> 
     <a class="labelbox" href="#!/news/Corsa">Corsa (5)</a><br><br><br> 
     <a class="labelbox" href="#!/news/PC" >PC (4)</a><br><br><br> 
     <a class="labelbox" href="#!/news/Altro" >Altro (2)</a><br><br><br>    
</div>

jQuery腳本

$(document).ready(function(){ 
    $(document).getUrl(window.location.hash,"#container");  

    $('a').click(
     function(){ 
     alert('clicked'); //debug 
      $(this).getUrl($(this).attr('href'),"#container"); 
     } 
    ); 
});

的功能的getURL

$.fn.getUrl = function(urlpass,whereadd){ 
    $(whereadd).html("<div class='ajaxloader'><img src='images/ajax-loader.gif'></div>");  
    var val=urlpass.split("#!");  
    val = val[val.length-1];  
    val = val.split("/"); 
    if(val[1]==null) val[1]="news";   
     $.ajax({ 
      url: val[1]+".php", 
      type: "POST", 
      data: "tag="+val[2], 
      cache: false, 
      success: function(html){ 
      $(document).find(whereadd).html(html); 
     } 
    }); 
}

預先感謝您

來源

2011-02-06 Marcx

從我可以告訴你更多的加載HTML有那些奇怪的鏈接進入文檔，但你不打電話給t他再次轉換功能。總體而言，您的方法是與完全相反的的unobtrusive JavaScript。

現在您的頁面內容只能通過JS訪問。這對可訪問性和搜索引擎優化很不利

而不是通過JavaScript加載所有的內容，你應該提供普通的靜態頁面與舊的/foo/bar鏈接。然後，在啓用JS的情況下，抓取頁面加載中的所有鏈接並分配點擊處理程序以通過AJAX加載內容。

這樣你就可以得到花哨的AJAX東西AND一個體面的工作頁面，以防萬一沒有JavaScript。

我還建議你看看semantic layout。

無恥插頭
對於應用上述技術的示例，請在我的WIP portfolio site看看。

來源

2011-02-06 17:25:44

嗨，感謝您的回覆..我知道這是不顯眼的js的完全相反，而且這個網站只通過JS訪問，我的觀點不是這個，我問了另一個句子：爲什麼有些鏈接工作而其他人不工作??? – Marcx 2011-02-06 17:42:23

奇怪的鏈接行爲

回答

相關問題