Javascript 创建列表后刷新jQuery库<；ul>；动态清空

我正在使用jQuery gallery，它在第一次加载图像时默认使用js；单击按钮后，我清空列表并再次加载图像，但图像不会显示，即使我使用了函数

.reload（）

。 在.reload（）上，再次加载页面，并再次显示默认图像，但我希望已加载的图像在列表为空后单击按钮。 我还使用了只刷新页面某些部分的方法。即

这里的“list”id是我要先清空的，而“1”是我要重新加载的div，其中包含gallery with id=“slider”，下面是我的全部功能：

("#list").empty(); 
    $("#1").reload(location.href+" #slider>*");


    var button=i;
    if(button==1){
            alert('1')
        $('ul').append('<li> <img src="images/round.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   :</strong>500 <br>    <strong>Rent       : </strong>5000 Rs.<br> <strong>Arrangment : </strong>Circular Table Arrangement.<br></center></li>');
    }

    if(button==2){

        $('ul').append('<li> <img src="images/round.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   :</strong>500 <br>    <strong>Rent       : </strong>5000 Rs.<br> <strong>Arrangment : </strong>Circular Table Arrangement.<br></center></li>');
        $('ul').append('<li> <img src="images/square.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   : </strong>10,000<br><strong>Rent       : </strong>35,000 Rs.<br><strong>Arrangment : </strong>Square Table Arrangement. <br></center>  </li>');                                 

    }
    if(button==3){

        $('ul').append('<li> <img src="images/round.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   :</strong>500 <br>    <strong>Rent       : </strong>5000 Rs.<br> <strong>Arrangment : </strong>Circular Table Arrangement.<br></center></li>');
        $('ul').append('<li> <img src="images/square.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   : </strong>10,000    <br>                                <strong>Rent       : </strong>35,000 Rs.<br><strong>Arrangment : </strong>Square Table Arrangement. <br></center>  </li>'); 
        $('ul').append('<li> <img src="images/square.jpg" style="height:400px;width:900px;" /> </li>');

    }
    if(button==4){
        $('ul').append('<li> <img src="images/round.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   :</strong>500 <br>    <strong>Rent       : </strong>5000 Rs.<br> <strong>Arrangment : </strong>Circular Table Arrangement.<br></center></li>');
        $('ul').append('<li> <img src="images/square.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   : </strong>10,000    <br>                                <strong>Rent       : </strong>35,000 Rs.<br><strong>Arrangment : </strong>Square Table Arrangement. <br></center>  </li>'); 
        $('ul').append('<li> <img src="images/line.jpg" style="height:400px;width:900px;" /> </li>');
        $('ul').append('<li> <img src="images/square.jpg" style="height:400px;width:900px;" /> <center> <strong>Capacity   : </strong>10,000    <br>                                <strong>Rent       : </strong>35,000 Rs.<br><strong>Arrangment : </strong>Square Table Arrangement. <br></center>  </li>'); 

    }
}

（“#列表”）.empty（）；
$（“#1”）.reload（location.href+“#slider>*”）；
var按钮=i；
如果（按钮==1）{
警报（'1'）
$（'ul'）。追加（'li>容量：500
租金：5000卢比。
排列：圆桌排列。
'）；
}
如果（按钮==2）{
$（'ul'）。追加（'li>容量：500
租金：5000卢比。
排列：圆桌排列。
'）；
$（'ul'）。追加（'li>容量：10000
租金：35000卢比。
排列：方桌排列。
'）；
}
如果（按钮==3）{
$（'ul'）。追加（'li>容量：500
租金：5000卢比。
排列：圆桌排列。
'）；
$（'ul'）。追加（'li>容量：10000
租金：35000卢比。
排列：方桌排列。
'）；
$（'ul'）。追加（'li>
'）；
}
如果（按钮==4）{
$（'ul'）。追加（'li>容量：500
租金：5000卢比。
排列：圆桌排列。
'）；
$（'ul'）。追加（'li>容量：10000
租金：35000卢比。
排列：方桌排列。
'）；
$（'ul'）。追加（'li>
'）；
$（'ul'）。追加（'li>容量：10000
租金：35000卢比。
排列：方桌排列。
'）；
}
}

您的浏览器是否支持html 5，因为您使用id作为数字，这是html 5规范的一部分，尽管它根本不建议使用。首先从ul中删除所有元素，而不是直接附加它。我使用上面的list.empty（）方法删除它。不确定您使用的是什么库，但这是您想要的吗？最好将图像路径存储为json或xml，并使用ajax调用它，而不是刷新它。