-1
我在網上發現了這個代碼，滿足了我對我的網站一個功能的需求。JavaScript/jQuery：命名函數
$(document).ready(function() {
var markers = []; // define global array in script tag so you can use it in whole page
var myCenter = new google.maps.LatLng(1.3000, 103.8000);
var mapProp = {
center: myCenter,
zoom: 6,
minZoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: true
};
//google map object
var map = new google.maps.Map(document.getElementById("map"), mapProp);
//change event of input tag where type=file and id=filename
$("#filename").change(function (e) {
var ext = $("input#filename").val().split(".").pop().toLowerCase();
if ($.inArray(ext, ["csv"]) == -1) {
alert('Upload CSV');
return false;
}
if (e.target.files != undefined) {
var reader = new FileReader();
reader.onload = function (e) {
var csvval = e.target.result.split("\n");
var csvvalue;
for (var i = 0; i < csvval.length; i++) {
markers[i] = [];
csvvalue = csvval[i].split(",");
markers[i][0] = csvvalue[0]; //id
var lat = csvvalue[2]; //latitude
var lng = csvvalue[3]; //longitude
var code = csvvalue[0];
if (code.includes("AB")) {
var nsMarker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/red-dot.png',
position: new google.maps.LatLng(lat, lng),
map: map
});
} else if (code.includes('CD')) {
var ewMarker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/green-dot.png',
position: new google.maps.LatLng(lat, lng),
map: map
});
} else if (code.includes('EF')) {
var neMarker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/purple-dot.png',
position: new google.maps.LatLng(lat, lng),
map: map
});
} else if (code.includes('GH')) {
var ccMarker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png',
position: new google.maps.LatLng(lat, lng),
map: map
});
} else if (code.includes('IJ')) {
var dtMarker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/blue-dot.png',
position: new google.maps.LatLng(lat, lng),
map: map
});
} else if (code.includes('KL')) {
var cgMarker = new google.maps.Marker({
icon: 'http://maps.google.com/mapfiles/ms/icons/green-dot.png',
position: new google.maps.LatLng(lat, lng),
map: map
});
}
//markers[i][1] = new google.maps.Marker({
// position: new google.maps.LatLng(lat, lng),
// map: map
//});
}
};
reader.readAsText(e.target.files.item(0));
}
return false;
});
});
該功能主要是爲用戶上傳座標的csv文件，然後在地圖上創建標記來標記這些位置。但是，沒有明確的功能名稱。這是html部分：
<input type="file" id="filename" name="filename" />
供用戶選擇他們想上傳的.csv文件。我的問題是，如果我希望用戶能夠上傳另一個輸入.csv文件來執行其他操作，我該如何實現一組類似的代碼？就像從根本上說，它會是相同的，他們將上傳一個.csv文件，並將提取緯度和經度以確定輸入中的各個位置，但是我想在其他.csv文件中添加其他一些功能。我可以再補充一個函數名稱，如
$(document).ready(function() readAllLocations { ... // for the FIRST .csv in
問題
，那麼第二次我需要這個類似的功能我剛剛加入另一個腳本標籤開始
$(document).ready(function() secondFunction {....
和來自onclick="secondFunction()"的html調用secondFunction還是什麼？我對JavaScript有很少的經驗，所以請原諒我，如果我的問題聽起來很愚蠢的話。我一直試圖解決這一整天，我不能。謝謝你們！
首先;你主要使用jQuery。第二;我仍然試圖更好地理解你的問題，但部分'$（document）.ready（function（）{codes}）;'檢查DOM是否準備好，然後它內部的代碼執行，你不必重複那。在JavaScript中你聲明瞭新的函數，比如： 'function first（）{codes}'，其中「first」是函數的名字。那麼你可以根據需要多次打電話給他們; '第一（）;'。 – Person