[英]it does not run Javascript code before Php, onClick submit button
單擊其假設以從Java腳本獲取值並將其提交給php; 取而代之的是,它僅采用下拉值,這意味着JavaScript代碼不會運行。 我不確定java腳本代碼是否可以運行? 這是我的代碼:
<section class="main-container">
<div class="main-wrapper">
<h2>Home</h2>
<form method="GET" action="storelocator.php" >
<input type="submit" value="Stores">
<input id="latitudeId" name="lat" type="hidden" >
<input id="longitudeId" name="lng" type="hidden" >
<div class="dropdown">
<select name="radius">
<option value="1000">1000</option>
<option value="500" selected="selected" >500</option>
<option value="300">300</option>
<option value="100">100</option>
</select>
</div>
</form>
<p id="show"></p>
<script type="text/javascript">
var x = document.getElementById("show");
var form = document.querySelector('form');
form.addEventListener('submit', function(e) {
e.preventDefault();
getLocation();
});
//Event to be added to the hidden form
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
var lat = position.coords.latitude;
var lng = position.coords.longitude;
document.getElementById("latitudeId").value = lat;
document.getElementById("longitudeId").value = lng;
form.submit();
}
</script>
你可以試試這個
<html>
<body>
<section class="main-container">
<div class="main-wrapper">
<h2>Home</h2>
<script>
//Event to be added to the hidden form
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
document.getElementById("show").innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
document.getElementById("latitudeId").value = position.coords.latitude;
document.getElementById("longitudeId").value = position.coords.longitude;
document.getElementById('myForm').submit();
}
</script>
<form id="myForm" method="GET" action="index.php" >
<input type="button" value="Stores" onclick="getLocation()">
<input id="latitudeId" name="lat" type="hidden" >
<input id="longitudeId" name="lng" type="hidden" >
<div class="dropdown">
<select name="radius">
<option value="1000">1000</option>
<option value="500" selected="selected" >500</option>
<option value="300">300</option>
<option value="100">100</option>
</select>
</div>
</form>
<p id="show"></p>
</div>
</section>
</body>
</html>
在內容之前加載腳本,以便您可以處理點擊事件
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.