javascript code execute on button click but not on enter key presses
I am searching location onclick on button. result is getting on onclick button. but same code i have put in submit function but here searching is not working.
on button click code.(this is working)
$("#gobuttton").click(function() {
$("#gmaplatlon").validate({
rules:{"latitude":{number:true}, "longitude":{number:true}, "zoom":{digits:true,min:0}},
errorPlacement:errorMessages
});
$("#address").change(function(){
geocoder.geocode({"address": $(this).attr("value")}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setZoom(16); map.setCenter(results[0].geometry.location); } else { alert("Geocode was not successful for the following reason: " + status); } });
});
});
press enter button code(same but not working)
$('#frm').keypress(function(e) {
var code = e.keyCode;
if(code === 13){
e.preventDefault();
alert(code);
$("#gmaplatlon").validate({rules:{"latitude":{number:true}, "longitude":{number:true}, "zoom":{digits:true,min:0}}, errorPlacement:errorMessages});
$("#address").change(function(){ geocoder.geocode({"address": $(this).attr("value")}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setZoom(16); map.setCenter(results[0].geometry.location); } else { alert("Geocode was not successful for the following reason: " + status); } }); });
}
});
my functionality is - enter address in textbox and press enter key then it should be searching on google map, this is executed on button click but not when enter key is pressed.
HTML code is as follows
<form method="post" name="frm" id="frm" enctype="multipart/form-data" action="<?php echo site_url('home/sendmapdata');?>">
<input name="address" type="text" id="address" border: solid 1px; " size="60" value="Search from address" onClick="this.value=''">
<input type="button" id="gobuttton" value="go">
<div id="map_canvas" style="height: 480px; width:665px; " ></div>
<input type="hidden" name="gmaplatlon" value="true">
<p align="center">
<input type="submit" name="okbutton" value="OK" >
</p>
</form>
Tyr这个：
$(document).ready(function(){
$('#address').keypress(function(e) {
var code = e.keyCode;
if(code === 13){
//e.preventDefault();
alert(code);
$("#gmaplatlon").validate({rules:{"latitude":{number:true}, "longitude":{number:true}, "zoom":{digits:true,min:0}}, errorPlacement:errorMessages});
$("#address").change(function(){ geocoder.geocode({"address": $(this).attr("value")}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setZoom(16); map.setCenter(results[0].geometry.location); } else { alert("Geocode was not successful for the following reason: " + status); } }); });
}
return false;
});
});
Try this change $('#frm').keypress(function(e) to $('#address').keypress(function(e)
UPDATE:
I think your issue is validate which is preventing from calling the map function, add this $('#frm').valid() inside your keypress function
您应该尝试将#address事件提供给#address而不是#frm ：
$('#frm').on('keypress', '#address', function(e) {