在不同的div中显示内容

Question

如何在不同的div中显示来自外部.html文件的内容。 例如，如果“ li”的id = 1，则在“ id = content1”中显示它。 如果id = 2，则在“ id = content2”中显示。 现在，外部.html文件中的所有内容都显示在id ='content'中

这是我的js

var hash = window.location.hash.substr(1);
var href = $('#nav li a').each(function(){
    var href = $(this).attr('href');
    if(hash==href.substr(0,href.length-5)){
        var toLoad = hash+'.html #content';
        $('#content').load(toLoad)
    }                                           
});

$('#nav li a').click(function(){

    var toLoad = $(this).attr('href')+' #content_from_external';
    $('#content').slideUp('normal',loadContent).delay(200);
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
    function loadContent() {
        $('#content').load(toLoad,showNewContent)
    }
    function showNewContent() {
        $('#content').slideDown(1000);

    }
    return false;

});

这是我的HTML

 <ul id="nav" class="products">
                        <li id="1">
                          <a href="products/1.php"><img src="1.jpg"/></a>
                        </li>
                        <li class="under" id="2">
                         <a href="products/2.php"><img src="2.jpg"/></a>
                        </li>
                        <li id="3">                            
                         <a href="products/3.php"><img src="3.jpg"/></a>
                        </li>

                        </li>
  </ul>

Answer 1

$('#nav li a').click(function(){
    var toLoad = $(this).attr('href')+' #content_from_external';
    var divId = '#content' + $(this).parents('li').attr('id');

    $(divId).slideUp('normal',loadContent).delay(200);
    ...