Question

请查看：

http://net.tutsplus.com/tutorials/javascript-ajax/how-to-load-in-and-animate-content-with-jquery/

我想做演示所做的一切，只使用表格行点击而不是href链接。我该怎么做？

修改的

这是我尝试使用的代码：

<script>
$(document).ready(function() {  

    // Check for hash value in URL  
    var hash = window.location.hash.substr(1);  
    var href = $('#MyTable_ID tr td').each(function(){  
        var href = $(this).attr('href');  
        if(hash==href.substr(0,href.length-5)){  
            var toLoad = hash+'.html #DivContent_ID';  
            $('#DivContent_ID').load(toLoad)  
        }  
    });  

    $('#MyTable_ID tr td').click(function(){  

    var toLoad = $(this).attr('rel')+' #DivFromExternalPage';  
    $('#DivContent_ID').hide('fast',loadContent);  
    $('#load').remove();  
    $('#wrapper').append('<span id="load">LOADING...</span>');  
    $('#load').fadeIn('normal');  
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);  
    function loadContent() {  
        $('#DivContent_ID').load(toLoad,'',showNewContent())  
    }  
    function showNewContent() {  
        $('#DivContent_ID').show('normal',hideLoader());  
    }  
    function hideLoader() {  
        $('#load').fadeOut('normal');  
    }  
    return false;  

    });  
});  
</script>

Answer 1

添加一个带有id的表，例如id ='links'

喜欢

<table id='links'>
  <tr>
    <td rel='index.html'>index</td>

然后更改

$('#nav li a').click(function(){ //change the targeted element
var toLoad = $(this).attr('href')+' #content'; //was the source of the URL we needed

到

$('#links tr td').click(function(){ //changed to the td inside a ID'd table
var toLoad = $(this).attr('rel')+' #content'; //the rel attribute now holds that URL for us...

表行单击，外部加载

1 个答案: