我有一个 sellhouse.jsp，我正在尝试从用户那里获取值，即姓名和地址，并将其插入数据库。在将值插入数据库之前，我尝试调用 JavaScript 来获取用户输入地址的地理编码。但是，在我提交表单之前，脚本会被执行。但我希望一旦我单击提交按钮就执行脚本。除此之外，我希望将地理编码传递给 jsp 元素。
这是 sellhouse.jsp
<%@page import="java.sql.ResultSet"%>
<%@page import="javax.swing.JOptionPane"%>
<%@page import="java.sql.Statement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Sell Page</title>
</head>
<body>
<h1>Hello World!</h1>
<form action="sellHouse.jsp" method="POST">
Name: <input type="text" name="Name" value="" placeholder="please Enter your Name" />
Address1: <input type="text" name="Address1" value="" placeholder="please Enter your Name" />
Address2: <input type="text" name="Address2" value="" placeholder="please Enter your Name" />
City: <input type="text" name="City" value="" placeholder="please Enter your Name" />
State: <input type="text" name="State" value="" placeholder="please Enter your Name" />
Country: <input type="text" name="Country" value="" placeholder="please Enter your Name" />
Zip: <input type="text" name="Zip" value="" placeholder="please Enter your Name" />
<input type="submit" value="submit" name="Submit" />
</form>
<%
try
{
String name = request.getParameter("Name");
String addr1 = request.getParameter("Address1");
String addr2 = request.getParameter("Address2");
String City = request.getParameter("City");
String State = request.getParameter("State");
String country = request.getParameter("Country");
String zip = request.getParameter("Zip");
String geocoderadd = name + addr1 + addr2 + City + State + country + zip;
%>
<script>
function initMap() {
//var map = new google.maps.Map(document.getElementById('map'), {
//zoom: 8,
//center: {lat: -34.397, lng: 150.644}
//});
var geocoder = new google.maps.Geocoder();
document.getElementById('submit').addEventListener('click', function() {
geocodeAddress(geocoder);
});
}
function geocodeAddress(geocoder) {
//var address = document.getElementById('address').value;
//var address = request.getParameter("FirstName");
var address = <%=geocoderadd%>;
//alert(address);
geocoder.geocode({'address': address}, function(results, status) {
if (status === google.maps.GeocoderStatus.OK) {
alert("Done");
resultsMap.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: resultsMap,
position: results[0].geometry.location
});
alert(results[0].geometry.location);
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
});
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDubMBIwomXLLoL2ueDx1tb1ErpsuxnWrE&v=3&callback=initMap" >
</script>
<%
int latitude ;
int longitude ;
if(name!=null){
Class.forName("oracle.jdbc.OracleDriver");
out.println("fkjngskldfng");
Connection con = DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:xe", "OHMS", "OHMS");
Statement st = con.createStatement();
st.executeUpdate("INSERT INTO SELLHOUSE VALUES('" + name + "','" + addr1 + "','" + addr2 + "','" + City + "','" + State + "','" + country + "','" + zip + "','" + latitude + "','" + longitude + "')");
if (st != null) {
JOptionPane.showMessageDialog(null, "Registered Successfully");
//session=request.getSession();
//session.setAttribute("userName", userName);
response.sendRedirect("index.html");
}
}
}catch(Exception e){
JOptionPane.showMessageDialog(null, e.getMessage());
}
%>
</body>
</html>
最佳答案
我认为您不需要再次addEventlistener到submit按钮。
您所能做的就是将 event.preventDefault 添加到提交函数中。或者您可以将按钮类型更改为 button。
// if button type is submit
document.forms["someFormName"].onsubmit = function(){
var geocoder = new google.maps.Geocoder();
geocodeAddress(geocoder);
}
关于javascript - 从 JSP 调用 JavaScript，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38278111/