2017-11-28 28 views
0

現在、Javaオブジェクトのライブ値をJavascriptで取得して、進行状況バーを埋めるようにしています。ここで JSP Javascript、javaオブジェクト値を更新する

は、JSPファイル内のコードです:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
pageEncoding="ISO-8859-1"%> 
<%@ page import="server_ihm_web.server"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Insert title here</title> 
</head> 
<style> 
#myProgress { 
width: 100%; 
background-color: #ddd; 
} 

#myBar1 { 
width: 1%; 
height: 30px; 
background-color: #4CAF50; 
} 

#myBar2 { 
width: 1%; 
height: 30px; 
background-color: #4CAF50; 
} 

#myBar3 { 
width: 1%; 
height: 30px; 
background-color: #4CAF50; 
} 
</style> 
<body> 

<h1>JavaScript Progress Bar</h1> 

<div id="myProgress"> 
    <div id="myBar1"></div> 
</div> 
<br> 
<div id="myProgress"> 
    <div id="myBar2"></div> 
</div> 
<br> 
<div id="myProgress"> 
    <div id="myBar3"></div> 
</div> 
<% 
    server serv = new server(); 
    serv.startServer(); 
%> 
</body> 
<button onclick="move()">Click Me</button> 

<script> 
function move() { 

    var elem = document.getElementById("myBar1"); 
    var elem2 = document.getElementById("myBar2"); 
    var elem3 = document.getElementById("myBar3"); 

    var id = setInterval(update, 100); 

    function update() { 
     elem.style.width = <%=serv.getBar1()%> + '%'; 
     elem2.style.width = <%=serv.getBar2()%> + '%'; 
     elem3.style.width = <%=serv.getBar3()%> + '%'; 
    } 
} 
</script> 
</html> 

SERV値は、数秒ごとに更新されているが、何もプログレスバーのために変化しません。

いつもupdate()が呼び出されるたびにオブジェクトの基本値を取ると思うので、プログレスバーは同じ値に変更されます。

javascriptのservの値を更新する方法はありますか?私はあなたが別の次元に住んで物事を混合していると思う

答えて

1

:)

Javascriptがサーバー上でブラウザとJava(JSP)で実行されます。

あなたのアイデアがjspスクリプトレットをユーザーのブラウザで実行することになっていたら、それは起こりません。

ユーザーのブラウザに既に進行中の進行状況でページを更新する必要がある場合は、バックグラウンドで更新を取得するためにいくつかのajax呼び出しを実装する必要があります。

+0

この質問とこれと同じ答えが頻繁に現れ、私はこれらの新しいものを重複したものとしてマークするためのよくある質問と回答が必要だと感じています。 –

0

JSPタグ<%= ... %>は、サーバーで評価されます。の前に、ページが初めてブラウザに表示されます。したがって、そのタグの値は静的であり、javascript関数の実行ごとに変化しません。

この値を変更するには、サーバーに要求してページをリロードする必要があります。毎回ページ全体を再ロードしないようにするには、Javascriptで表示する新しい値を取得するためにAjaxリクエストを行う必要があります。

関連する問題