AJAX初學者：如果然後聲明

在menu.html，我有我的菜單項（A HREF鏈接），讓我們給他們打電話，menu_1，menu_2，....AJAX初學者：如果然後聲明

在map.js顯示的內容地圖，它調用一個API來顯示一些圖層和地圖。我有很多地圖可以顯示，但我只想調用一次api。

使用AJAX，我想知道是否有可能在我的js中有一個if/then或select/case，這樣如果menu_1被點擊，然後實現map_1等，而無需重新加載頁面。我認爲我可以做到這一點的唯一方法是使用Post/get ..因此，當您點擊menu_1時，它會將您帶到page.php？page_id = 1。 JS會讀取並顯示地圖。

我是新來的JS和AJAX所以請隨時殺豬我

來源

2010-03-18 dassouki

當然使用AJAX工作的框架，特別是如果你是新來的JS和AJAX。我在兩個月前開始經常使用jQuery，現在我可以編寫非常複雜的AJAX方法。有了這個平臺可以讓事情變得更容易。有關更多詳細信息，請參閱下面的答案。 – dclowd9901

是的，事實上，如果你正在使用jQuery只需將它添加click事件處理程序，以每這些鏈接：

的jQuery （「#my_menu_item」）。click（function（）{ //點擊菜單項時做點什麼...... }）;

然後，您可能會使用jQuery.post或jQuery.get來檢索URL並更新您的頁面。

來源

2010-03-18 16:43:43

DEMO：http://jsbin.com/ohaxa/4/edit

$(function() { 
    $('#menu li > a').click(function(e) { 
    e.preventDefault(); 

    var my_id = $(this).attr('id'); // li a # 

$.ajax({ 
    type: "POST", 
    url: "ajax_call.php", 
    data: "action=do_something&my_id=" + my_id, 
    success: function(data){ 

    my_function(my_id); //run your outside function... 

    //OR use "data" from the php echo and append it to DOM 
    // $(#ajax_call_back).append(data); 

    }, 
    complete: function(data){ 
    //on complete do something.. 
    }, 
    error: function(data){ 
    //this here for demo pseudo ajax handle error instead! 
    my_function(my_id); 

    }, 
}); 

}); 
}); 

function my_function(id) { 
    alert(id); 
    var map = ''; 

    switch(id) 
{ 
case 1: 
map = id; //map_1 
    break; 
case 2: 
map = id; //map_2 
    break; 
case 3: 
map = id; //map_3 
    break; 
default: 
map = id; //map_0 
} 

$('#application').text('map_' + map); 

};

 <ul id="menu"> 
      <li><a href="#" id="1">menu_1</a></li> 
      <li><a href="#" id="2">menu_2</a></li> 
      <li><a href="#" id="3">menu_3</a></li> 
      <li><a href="#" id="4">menu_4</a></li> 
      <li><a href="#" id="5">menu_5</a></li> 
     </ul> 

    <div id="application"></div> 
    <div id="ajax_call_back"></div>

來源

2010-03-18 18:26:55

AJAX初學者：如果然後聲明

回答

相關問題