2009-09-12 116 views
0

我嘗試使用this教程嘗試將內容加載到div中。不幸的是,這只是將HTML文件作爲新頁面加載。使用mootools不工作的Ajax請求

這是應該做的工作

window.addEvent('domready', function() { 

     $('runAjax').addEvent('click', function(event) { 
         event.stop(); 
         var req = new Request({ 
             method: 'get', 
             url: $('runAjax').get('href'), 
             data: { 'do' : '1' }, 
             onRequest: function() { alert('The request has been made, please wait until it has finished.'); }, 
        onComplete: function(response) { alert('Response received.); $('container').set('html', response); } 
         }).send(); 
$('runAjax').removeEvent('click'); 
     }); 
}); 

的JavaScript這是一個應該啓動功能

<a href="about.html" id="runAjax" class="panel">Profil</a> 

的鏈接,這是的index.html的DIV結構。我想要的內容被加載到「容器」

<div id="view"> 
    <div id="sidebar"> 
     mib 
    </div> 

    <div id="container"> 
     <div id="logo"> 
      <!--img src="img/logo.png"--> 
     </div> 

     <div align="center" id="tagline"> 
      content 
     </div> 
    </div> 
</div> 

我真的不關心我用什麼腳本,只要它與MooTools的1.2兼容的,因爲我需要它滑動頂部面板,它會-div例如,將其更改爲jquery面板還有很多工作要做。

回答

0

有一個「丟失的位置:

alert('Response received.); 
+0

這就是如何copypasta可以要你的命 – ngmir 2009-09-12 12:23:41

+0

...但它也不管用 – ngmir 2009-09-12 12:36:10

0

你正在做的事情複雜得多,你需要。這給一試:

window.addEvent('domready', function(){ 
    function loadPage(url) { 
     $('container').load(url); 
    } 

    $('runAjax').addEvent('click', function(e) { 
     e.stop(); 
     loadPage(this.get('href')); 
     this.removeEvent('click', loadPage); 
    }); 
}); 

如果不工作,啓動螢火蟲,看到越來越記錄了哪些Javascript錯誤。下面是該Element.load()快捷參考:

http://mootools.net/docs/core/Request/Request.HTML#Element:load

0

您還沒有停止的單擊事件的建議。而不是

event.stop();

做:

new Event(event).stop();