2016-05-18 17 views
1

Ich beginne gerade, JavaScript zu lernen und weiß daher nicht viel darüber, wie Formulare verwendet werden oder wie man von ihnen liest. Ich versuche mit dem Geocode von Google herumzuspielen und benötige Hilfe beim Erstellen eines JS Forms zum Lesen.Wie lese ich Eingabedaten in einem Formular?

ich folgende JS-Code haben, die Länge & Breite ausgibt, und müssen nur ein Formular in ein paar Adressen speichern Der Code, den ich Aussehen haben, wie folgt:.

var geocoder = new google.maps.Geocoder(); 
var address = document.getElementById("address").value; 
geocoder.geocode({'address': address}, function(results, status) { 
    if(status == google.maps.GeocoderStatus.OK) 
    { 
     results[0].geometry.location.latitude 
     results[0].geometry.location.longitude 
    } 
    else 
    { 
     alert("Geocode was not successful for the following reason: " + status) 
    } 
}); 

ich etwas Hilfe möchte, wenn möglich, um ein Formular zu erstellen, kann dieser Code eine Adresse aus lesen, wo die ElementID = "Adresse". Wie würde eine solche Form aussehen? Ich würde es sehr schätzen, wenn sich jemand ein oder zwei Minuten Zeit nehmen und erklären könnte, wie das JS mit dem Formular arbeitet. Jede Hilfe wird geschätzt! Danke Jungs.

Antwort

0

zuerst ein Formular in HTML erstellen. Fügen Sie Ihre externe Javascript-Datei darin ein.

<head> 
<script type="text/javascript" src="index.js"></script> //index.js is name of javascript file which is in same location of this jsp page. 
</head> 
<body> 
<form name="EmployeeDetails" action="ServletEmployee" method="post"> 
Employee Name:<input type="text" id="name"><br> 
EmployeeID:<input type="text" id="employID"><br> 
<input type="submit" value="Submit"> 
</form> 
<input type="button" name="Click" id="mybutton" onclick="myButtonClick"> 
</body> 

In Ihrer externen Javascript-Datei ... das ist index.js

window.onload = function(){ // function which reads the value from html form on load without any button click. 
var employeename = document.getElementById("name").value; 
var employeeid = document.getElementById("employID").value; 
alert("Name : "+employeename+" : EmployeeID : "+employeeid); 
} 

function myButtonClick(){ // function to read value from html form on click of button. 
var empname = document.getElementById("name").value; 
var empid = document.getElementById("employID").value; 
alert("Name : "+empname+" : EmployeeID : "+empid); 
} 
+0

Danke, Arun! Schätze die Antwort. – LearningJS888

+0

Bitte versuchen Sie es, und wenn Sie das Gefühl haben, es ist eine richtige Antwort, wird es für andere hilfreich sein. – Arun

+0

Fertig. Darf ich Sie bitten, einen Blick auf meine zweite Frage zu werfen: http://stackoverflow.com/questions/37304295/reading-address-from-form-output-longitude-latitude-javascript Vielen Dank! – LearningJS888

1

JS dosent Pflege, was das Element ist, müssen Sie nur die Referenz des Formulars aus dem DOM, dann können Sie tun, was Sie wollen (den Wert erhalten).

kann eine einfache Form wie diese So

<form> 
First name:<br> 
<input type="text" id="firstname"><br> 
Address:<br> 
<input type="text" id="address"> 
</form> 
<button onclick="myFunc()">Done!</button> 

aussehen, wenn die Schaltfläche es klicken, wird eine Funktion myFunc laufen die Daten aus dem Formular bekommen und es aufmerksam zu machen.

function myFunc(){ 
    var name = document.getElementById("firstname").value; 
    var address = document.getElementById("address").value; 
    alert(name + " lives at " + address); 
} 

mehr auf Elemente von id hier immer https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById

können Sie auch jquery verwenden

function myFunc(){ 
    var name = $("#firstname").val(); 
    var address = $("#address").val(); 
    alert(name + " lives at " + address); 
} 

https://api.jquery.com/id-selector/

+0

Danke, axrami! Ich schätze die Antwort! – LearningJS888

+0

Kein Problem :) denkst du es eine Antwort? – axrami

+0

Natürlich! Erledigt. – LearningJS888