2015-10-15 251 views
1

我有一個jsp頁面上,當我點擊任何圖像的圖像更改爲another.Now我想要的效果,一個用戶的變化必須反映給所有用戶在誰無刷新 整個頁面訪問這裏本網站的同時是我的代碼...............如何刷新多個div使用jquery

<html> 
<title>Java Web Starter Application</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<link rel="stylesheet" href="style.css" /> 

<head> 
<title>Manage Objects</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
<script> 
      $(document).ready(function() { 
       loadbulbData(); 
     }); 
//bulbstatus 
      function loadbulbData() { 
       $('#main').load('index.jsp', function() 
      { 
       //alert('inside refresh method'); 
       reloadData = window.setTimeout(loadbulbData, 20000) 
      }); 
     } 
</script> 
</head> 
<body> 


<%! public static int bulbStatus = 0; 
public static int tubeStatus=0; 
public static int fanStatus=0; 
public static int acStatus=0; 

%> 
    <% 


%> 

<% 
if(request.getParameter("BULB.x")!=null) 
{ 
    if(bulbStatus==0) 
     bulbStatus=1; 
    else 
     bulbStatus=0; 
} 

if(request.getParameter("BULBON.x")!=null) 
{ 
    if(bulbStatus==1) 
     bulbStatus=0; 
    else 
     bulbStatus=1; 
} 

if(request.getParameter("TUBEOFF.x")!=null) 
{ 
    if(tubeStatus==0) 
     tubeStatus=1; 
    else 
     tubeStatus=0; 
} 
if(request.getParameter("TUBEON.x")!=null) 
{ 
    if(tubeStatus==1) 
     tubeStatus=0; 
    else 
     tubeStatus=1; 
} 

if(request.getParameter("FanOff.x")!=null) 
{ 
    if(fanStatus==0) 
     fanStatus=1; 
    else 
     fanStatus=0; 
} 
if(request.getParameter("FanOn.x")!=null) 
{ 
    if(fanStatus==1) 
    fanStatus=0; 
    else 
     fanStatus=1; 
} 

if(request.getParameter("AcOff.x")!=null) 
{ 
    if(acStatus==0) 
    acStatus=1; 
    else 
     acStatus=0; 
} 
if(request.getParameter("AcOn.x")!=null) 
{ 
    if(acStatus==1) 
     acStatus=0; 
    else 
     acStatus=1; 
} 

%> 
    <% 
    if(bulbStatus==0) 
    {   
    %> 
    <p><font color="white"><center><b>Manage Objects</center></b></p> 
    <div id="main" name="alldivisions"> 
    <div id="NW" name="bulboffdiv"> 
    <form name="bulbForm" method="post" id="bulbonformid"> 
     <input type="image" src="images/pic_bulboff.png" align="center" id="imagebulb" name="BULB" value="bulb"></input> 
     <p><font color="RED"><b> BULB OFF</b></p> 

    </form> 
    </div> 
<% 
    } 
    else 
    { 

%> 
    <p><font color="white"><center><b>Manage Objects</center></b></p> 
    <form name="bulbon" method="post"> 
    <div id="NW" name="bulbondiv"> 
     <input type="image" src="images/pic_bulbon.png" align="center"  id="imagebulb" name="BULBON" value="bulb"></input> 
     <p><font color="Green"><b> BULB ON</b></p> 
    </div> 

</form> 

<% 
    } 
    if(tubeStatus==0) 
    { 
    %> 
    <form name="lampOffForm" method="post"> 
    <div id="NE" name="lampoffdiv"> 
     <input type="image" src= "images/lampoff.png" align="center"  name="TUBEOFF" value="tube" id="lampoff"></input> 
     <p><font color="RED"><b> LAMP OFF</b></p> 
    </div> 
    </form> 
    <% } 
    else 
    { 
    %> 
    <form name="lampOnForm" method="post"> 
     <div id="NE" name="lampondiv"> 
     <input type="image" src= "images/lampon.png" align="center" name="TUBEON" value="tube" id="lampon"></input> 
     <p><font color="Green"><b> LAMP ON</b></p> 
    </div> 
    </form> 
    <% 
    } 
    if(fanStatus==0) 
    { 
    %> 
    <form name="fanOffForm" method="post"> 
     <div id="SW" name="fanoffdiv"> 
     <input type="image" src="images/Fanoff.png" align="center" id="image3" name="FanOff" value="ac"></input> 
     <p><font color="RED"><b> FAN OFF</b></p> 
    </div> 
    </form> 
    <% 
    } 
    else 
    { 
    %> 
    <form name="FanOnForm" method="post"> 
    <div id="SW" name="fanondiv"> 
     <input type="image" src="images/Fanon.png" align="center"  id="image3" name="FanOn" value="ac"></input> 
     <p><font color="Green"><b> FAN ON</b></p> 
    </div> 
</form> 
<%  
    } 
    if(acStatus==0) 
    { 
    %> 
    <form name="Acoffform" method="Post"> 
     <div id="SE" name="acoffdiv"> 
     <input type="image" src="images/ACoff.png" align="center" id="image4" name="AcOff" value="fan"></input> 
     <p><font color="RED"><b> AC OFF</b></p> 
    </div> 
    </form> 
    <% 
    } 
    else 
    { 
    %> 
<form name="AcOnForm" method="Post"> 
    <div id="SE" name="acondiv"> 
     <input type="image" src="images/ACon.png" align="center" id="image4" name="AcOn" value="fan"></input> 
     <p><font color="Green"><b> AC ON</b></p> 
    </div> 
    </form> 

<% 
    } 
%> 
</div> 
</body> 
</html> 

在此先感謝......

+0

在一行中..不可能沒有(數據庫或文件),這是服務器端腳本的工作你沒有標記 –

+0

@RohitKumar但我在這裏使用靜態變量 –

+0

但是你的每個靜態變量對於只有一個客戶端不是全部靜態變量客戶端訪問相同的網頁 –

回答

1

我認爲你只需要調用一個刷新數據的函數而不刷新。如果那是真的。然後你可以使用jQuery AJAX來獲取更新的數據和時間

一定量除權後輪詢它:

setTimeout(function(){ 
    $.ajax({ 
      url: "demo_test.txt", //url for fetching refreshed data 
      success: function(result){ 
        // write your refresh image code here 
      }   
    }); 
}, 5000); //specify the time interval after which you need to refresh the data(this is 5 secs) 
0

嘿,我解決這個問題只需添加在我的jQuery代碼如下

$('#main').load('index.jsp', function() #main)