每当textarea值发生变化时,我想在servlet中获取textarea值。我的页面每30秒自动刷新一次。所以我希望textarea值每30秒自动进入servlet,无需点击按钮。 以下是我的代码:
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta http-equiv="refresh" content="10" />
<link rel="stylesheet" href="css/home.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var x,y;
x=41.689844;
var origin = new google.maps.LatLng(x,-74.044874),
destination = new google.maps.LatLng(42.2569387,-71.0043555),
service = new google.maps.DistanceMatrixService();
var str1,str2,str3,str4;
function showlocation(){
navigator.geolocation.watchPosition(callback1);
}
function rel(){
location.reload(true);
}
function showlocation2(){
navigator.geolocation.watchPosition(callback2);
}
function callback1(position){
// document.getElementById('latitude').innerHTML=position.coords.latitude;
// document.getElementById('longitude').innerHTML=position.coords.longitude;
/* var str = 'Latitude: ' + position.coords.latitude + '<br>' +
'Longitude: ' + position.coords.longitude + '<br>' +
'Timestamp: ' + position.timestamp + '<br>\r\n' ;
document.getElementById('result').value += str;
*/
str1=position.coords.latitude;
str2=position.coords.longitude;
// document.getElementById('result1').value += str1;
// document.getElementById('result2').value += str2;
document.getElementById('result1').value = str1;
document.getElementById('result2').value = str2;
document.getElementById('originatt').value = ".";
document.getElementById('destatt').value = ".";
document.getElementById('distatt').value = ".";
document.getElementById('message1').innerHTML ="Trip Recording has started"+"<br>"+"Click Get Origin Address";
}
function callback2(position){
//document.getElementById('latitude').innerHTML=position.coords.latitude;
//document.getElementById('longitude').innerHTML=position.coords.longitude;
/* var str = 'Latitude: ' + position.coords.latitude + '<br>' +
'Longitude: ' + position.coords.longitude + '<br>' +
'Timestamp: ' + position.timestamp + '<br>\r\n' ;
document.getElementById('result').value += str;
*/
str3=position.coords.latitude;
str4=position.coords.longitude;
document.getElementById('result3').value += str3;
document.getElementById('result4').value += str4;
document.getElementById('originatt').value = ".";
document.getElementById('destatt').value = ".";
document.getElementById('distatt').value = ".";
document.getElementById('message1').innerHTML ="Trip Recording has stopped"+"<br>"+"Click to Get Destination Address";
}
service.getDistanceMatrix(
{
origins: [origin],
destinations: [destination],
travelMode: google.maps.TravelMode.DRIVING,
avoidHighways: false,
avoidTolls: false
},
callback
);
function callback(response, status) {
var orig = document.getElementById("orig"),
dest = document.getElementById("dest"),
dist = document.getElementById("dist");
if(status=="OK") {
orig.value = response.destinationAddresses[0];
dest.value = response.originAddresses[0];
dist.value = response.rows[0].elements[0].distance.text;
} else {
alert("Error: " + status);
}
}
function delay(ms) {
ms += new Date().getTime();
while (new Date() < ms){}
}
$("myform").submit(function() {
$(this).submit(function() {
return false;
});
return true;
});
</script>
</head>
<body>
<div id="img1">
<img src="images/home/logo.jpg" style="width:80%;">
</div>
<div id="main">
<form name="myform" action="TripRecorder" method="POST">
<h4> Click Start to record Origin and Stop to record Destination </h4>
<!--<span id="latitude" name="latit" hidden> </span>
<span id="longitude" hidden> </span>
<br>-->
<input type="button" name="start" class="st1" id="st" value="Start Trip" onclick="showlocation()"/>
<br><br/>
<span id="message1" name="msg1"> </span>
</br></br>
<input id="originatt" type="text" value="<%=request.getAttribute("origin5")%>" ><br><br>
<textarea id="result1" name="res1" value="str1" cols="20" rows="1" ></textarea> <br> <br/>
<textarea id="result2" name="res2" value="str2" cols="20" rows="1" ></textarea>
<input class="one" id="s1" type="submit" name="submit1" value="Get Origin Address" /> <br> <br/>
<!-- <input class="one" id="s1" type="submit" name="submit" value="Submit" /> <br> <br/> -->
<input type="submit" name="Submit" > <br>
</form>
<br>
<input type="button" value="Back to Submission Page" name="back" onclick="document.location.href='submission.jsp'" /> <br> <br/>
<h5>Check distance using Google Maps</h5>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3929.1219514911336!2d76.32904011409968!3d10.006784275664728!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3b08729de9da66b7%3A0x3ede9e0d7ae9f2fa!2sIGA+TECH+Industrial+Electronics+Pvt+Ltd!5e0!3m2!1sen!2sus!4v1456591588301" width="100" height="100" frameborder="0" style="border:0" allowfullscreen></iframe>
<br>
</div>
</body>
</html>
<script type="text/javascript">
window.setTimeout(function() {
repeat();
}, 1);
function repeat(){
document.getElementById("st").click();
}
function showvalue(){
//var someValue = $('#lat span').text();
var div = document.getElementById("test");
var spans = div.getElementsByTagName("span");
for(i=0;i<spans.length;i++)
{
alert(spans[i].innerHTML);
}
}
function submitForm() {
document.getElementById("myform").submit();
}
document.getElementById('submit1').onclick = function() {
setTimeout(submitForm, 3000);
};
</script>
我的servlet doPost方法:
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// processRequest(request, response);
String str1=request.getParameter("res1");
String str2=request.getParameter("res2");
System.out.println("coord="+str1+"/"+str2);
RequestDispatcher view = request.getRequestDispatcher("navigator_1.jsp");
view.forward(request, response);
}
答案 0 :(得分:1)
在你的jsp中使用以下内容....给你的表单提供id并在你的表单中包含你的textarea如果你不想将它包含在你的表单中你可以隐藏它以便它不可见并且不会#39; t需要页面上的任何空间。
window.setInterval(function(){
submit();/// call your function here
}, 30000);
<script language="javascript">
function submit(){
document.getElementById("myForm").submit();
}
</script>