サイトの管理セクションに、ページを更新せずにサイトをオフラインにするjQueryコードを記述しました。それはうまく機能しますが、1つのことのために:
TURN ONをクリックすると、ajax呼び出しが正確に行われ、すべてのクラスが変更され、テキストがTURNOFFに変更されます。ただし、このテキストをクリックしても何も起こりません。ページをリロードすると、リロードできるようになります。
$("#switch_off").click(function() {
$("#switch_off").html("<img style=\"padding-left:15px;\" src=\"/img/admin/ajax-loader.gif\">");
$('#switch_off').removeClass('ttip_b')
$.ajax({
url: "/settings/SwitchOffline",
type: "get",
data: '',
success: function(responseText, statusText, xhr, $form){ // Trigger when request was successful
$("#site_status").html("<span id=\"offline\" class=\"lbl error_bg\">Offline</span><span id=\"switch_on\" class=\"ttip_b\" title=\"Click to place Site Online\">Turn On</span>");
},
error: function(responseText){
//alert(responseText);
}
});
return false;
});
$("#switch_on").click(function() {
$("#switch_on").html("<img style=\"padding-left:15px;\" src=\"/img/admin/ajax-loader.gif\">");
$('#switch_on').removeClass('ttip_b')
$.ajax({
url: "/settings/SwitchOnline",
type: "get",
data: '',
success: function(responseText, statusText, xhr, $form){
$("#site_status").html("<span id=\"online\" class=\"lbl ok_bg\">Online</span><span id=\"switch_off\" class=\"ttip_b\" title=\"Click to place Site Offline\">Turn Off</span>");
},
error: function(responseText){
//alert(responseText);
}
});
return false;
});
いくつかのPHPを使用したHTMLコード
<div class="user_info user_sep" style="width:90px;">
<p class="sepH_a">
<strong>Site Status</strong>
</p>
<?php
//debug($site_offline);
if($site_offline){
?>
<span id="site_status">
<span id="offline" class="lbl error_bg">Offline</span>
<span id="switch_on" class="ttip_b" title="Click to place Site Online">Turn On</span>
</span>
<?php }else{ ?>
<span id="site_status">
<span id="online" class="lbl ok_bg">Online</span>
<span id="switch_off" class="ttip_b" title="Click to place Site Offline">Turn Off</span>
</span>
<?php } ?>
</div>