Ajax調用是否可以通過文本鏈接觸發？

Question

我使用一個下拉列表完成了一個小教程示例，該列表使用Ajax加載一些PHP頁面。

我的問題是，我可以使用文本鏈接，而不是下拉列表？如果是這樣，代碼如何改變？

$(document).ready(function() { 
    $('#category').change(function() { 

    var val = $(this).val(); 
    $('#firstresult').empty().addClass('loading').load(val + '.php', function(){ 
     $('#firstresult').removeClass('loading') 
    }); 

    }); 
}); 

Answer 1

$(document).ready(function() { 
    $('#yourLink').click(function(e) { 
    e.preventDefault();//so the link doesn't try to go somewhere 
    var val = $(this).text(); //get value from the TEXT of your link 

    $('#firstresult').empty().text('loading').addClass('loading'); //put 'loading' in your firstresult div and change the class to loading 
    $('#firstresult').load(val + '.php', function(){ 
     //load firstresult with what your php page returns 
     $('#firstresult').removeClass('loading') 
    }); 

    }); 
}); 

Answer 2

如果#category是您的文本鏈接的ID。

我輸入了返回false以防止點擊事件冒泡並重新加載您的頁面。

我沒有，雖然測試...

$(document).ready(function() { 
     $('#category').click(function() { 

     var val = $(this).attr('href'); 
     $('#firstresult').empty().addClass('loading').load(val + '.php', function(){ 
      $('#firstresult').removeClass('loading') 
     }); 

     return false; 

     }); 
    }); 

編輯

<a id="category" href="my_val" title="">my link</a> 

您可以從href屬性傳遞值

Answer 3

照此但具有點擊功能

$(document).ready(function() { 
    $('#my_link').click(function(e) { 
     e.preventDefault(); 
     var val=$(this).text(); 
     $('#firstresult').empty().addClass('loading').load(val + '.php', function(){ 
     $('#firstresult').removeClass('loading') 
     }); 

    }); 
}); 

Answer 4

您需要給文本鏈接一個id，但可能會將href關閉。

<一個ID = 'myTextLink'>鏈接</A>

$(document).ready(function() { 
    $('#myTextLink').click(function() { 

    var val = $(this).val(); 
    $('#firstresult').empty().addClass('loading').load(val + '.php', function(){ 
     $('#firstresult').removeClass('loading') 
    }); 

    }); 
});