デフォルトでjsを使用して初めて画像をロードするjQueryギャラリーを使用しています。ボタンをクリックすると、リストを空にして画像を再度ロードしますが、関数を使用しても画像が表示されません.reload()
。.reload() でページが再度読み込まれ、デフォルトの画像が再び表示されますが、リストを空にした後にボタンをクリックして読み込んだ画像が必要です。ページの一部のみを更新する方法も使用しました。すなわち
ここで、「リスト」IDを最初に空にし、「1」はリロードしたいdivであり、以下の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>');
}
}