因此,我有下一個HTML代碼,我的目標是將位置轉換為Geocode(lat&long)。
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery. min.js" type="text/javascript">< /script>
<script>.
$.ajax({
url: 'http://api.positionstack.com/v1/forward',
data: {
access_key: 'my private key'。
query: 'Thisshouldbeupdated(is my location e.g Transilvania,Romania)'。
limit: 1.
}
}).done(function(data) {
console.log(JSON.parse(資料)。
});
</script>>
<script>
var query = "";
function update() {
///通過ID找到輸入元素并將其值分配給`myVarToUpdate`。
query = document.getElementById(""/span>).value。
}
</script>>
</head>
<body>
<form>
< input id="query" value=" />
< button type="button" onclick="update()" > Update</button>
</form>/span>
</body>
</html>
所以,在我點擊更新(或提交)來更新var和重繪 并從PositionStack API獲得資料之后。
非常感謝您
uj5u.com熱心網友回復:
首先給你的表單一個識別方式。添加一個id或class來選擇表單。洗掉onclick事件監聽器,并將按鈕的型別改為submit
<form id="query-form">/span>
< input id="query" value=" />
<button type="submit"> 更新</按鈕>
</form>/span>
你需要在每次提交表單時能夠呼叫$.ajax請求。最簡單的方法是將AJAX請求包裹在一個函式中。讓我們把這個函式稱為getPosition。給該函式一個名為query的單一引數。這個引數是我們在呼叫getPosition函式時將發送給服務器的字串。
function getPosition(query) {
$.ajax({
url: 'http://api.positionstack.com/v1/forward',
data: {
access_key: 'my private key'。
query: 查詢。
limit: 1。
}
}).done(function(data) {
console.log(JSON.parse(資料)。
});
}
現在連接表單和getPosition函式。
選擇表單和查詢input。聽取表單元素上的submit事件。只要你在<form>元素內按下提交按鈕,就會觸發這個事件。
在提交時,獲取查詢輸入的值。然后呼叫getPosition函式,同時傳遞query值。
const $form = $('#query-form'/span>) 。
const $query = $('#query')。
$form.on('submit', event => {
event.preventDefault(); //Don't submit, but do our custom behavior.
const query = $query.val() 。
getPosition(query);
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/307637.html
標籤:
上一篇:添加附件會破壞郵件內容軌道
