如何在一个文件中添加多个函数
How can I add multiple functions to one file?
我正在尝试创建各种混搭...我希望函数在一个文件中,但是当我添加我的 Ajax 函数(一半)时,什么都没有显示。
我也想用jQuery显示它们,顶部功能(带有标记和信息的谷歌地图)都是一种享受,直到我添加底部功能。
我是否应该像谷歌一样将它们添加到(函数(){})中,以及googlemap函数末尾的()是什么?
当我在代码中调用我的函数时,我将如何调用 ajax 进行预览,因为 window.onload 已在 Google 中调用
。我知道我可以使用 $.ready 函数(){},但我只是将函数名称放在 .ready 函数 { } 中
我不确定如何将所有功能添加到一个文件中并使它们工作。基本上
这是代码:
(function() {
//define global variables
var map, geocoder, marker, infowindow;
window.onload = function() {
//creating the map
var options = {
zoom: 5,
center: new google.maps.LatLng(53.383, -1.483),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map'), options);
//code for catching the form submit event goes here
//Getting the reference to the HTML form
var form = document.getElementById('addressForm');
//Catching the forms submit event
form.onsubmit = function () {
//getting the address from the text input
var address = document.getElementById('address').value;
//Making the geocode call
getAddress(address);
//Preventing the form from doing a page submit
return false;
}
}
//Function Stub
function getAddress(address) {
//Check to see if we already have a geocode object.
//If not we create one
if(!geocoder) {
geocoder = new google.maps.Geocoder();
}
//Creating the geoCoderRequest Object
var geocoderRequest = {
address: address
}
//Making the geocode request
geocoder.geocode(geocoderRequest, function (results, status) {
//Check if status is ok beofre proceeding
if (status == google.maps.GeocoderStatus.OK){
//Center the map on the returned location
map.setCenter(results[0].geometry.location);
//Check to see if already a Marker there
if (!marker){
//Create a new marker and add it to the map
marker = new google.maps.Marker({
map: map
});
}
//Setting position of the Marker to returned location
marker.setPosition(results[0].geometry.location);
//Check to see if we've already an info window
if(!infowindow) {
//Creating a new info window
infowindow = new google.maps.InfoWindow();
}
//Creating the content of the info window to the Address
//and the returned position
var content = '<strong>' + results[0].formatted_address + '</strong><br />';
content += 'Lat: ' + results[0].geometry.location.lat() + '<br />';
content += 'Lng: ' + results[0].geometry.location.lng();
//Adding the content to the info window
infowindow.setContent(content);
//Opening the infoWindow
infowindow.open(map, marker);
}
});
}
})();
// beginning of new function
var xhr = false;
var xPos, yPos;
function prev(){
var link = document.getElementByTagName("a").onmouseover = showPreview;
}
function showPreview(evt) {
if (evt) {
var url = evt.target;
}
else{
evt = window.event;
var url = evt.srcElement;
}
xPos = evt.clientX;
yPos = evt.clientY;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
else {
if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) { }
}
}
if (xhr) {
xhr.onreadystatechange = showContents;
xhr.open("GET", url, true);
xhr.send(null);
}
else {
alert("Sorry, but I couldn't create an XMLHttpRequest");
}
return false;
}
function showContents() {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
var outMsg = xhr.responseText;
}
else {
var outMsg = "There was a problem with the request " + xhr.status;
}
var preview = document.getElementById('preview');
preview.innerHTML = outMsg;
preview.style.top = parseInt(yPos)+2 + "px";
preview.style.left = parseInt(xPos)+2 + "px";
preview.style.visibility = "visible";
preview.onmouseout = function(){
document.getElementById('preview').style.visibility = "hidden";
}
}
这取决于您添加函数的原因。 但这里有一个简单的公式。如果您希望仅在文档就绪时调用函数,并希望在加载文档时调用它们一次。然后将它们添加为"匿名函数"
例:
$(function () {
//you code
...............
// you can call your named functions also here.
//like
somefunction();
});
但是,如果您希望稍后在文档已加载时调用它们。然后添加"命名函数"
例:
function somename()
{
............
}
在这两种情况下,您都可以将它们放在一个文件中,并且关于函数末尾的();
,这是一种在JavaScript中立即调用匿名函数的方法,就像jQuery中的document.ready
一样。
相关文章:
- 如何将json文件添加到grunt构建中
- 如何将 JavaScript 和 CSS 文件添加到 MagentoModule
- 如何将jQuery文件添加到导航网站
- 将图像从文件添加到 HTML5 画布
- Drupal 7 将 jQuery 文件添加到所有页面
- 尝试将外部JS和CSS文件添加到我的rails应用程序中
- mongodb用户配置文件添加输入时出现问题
- 通过JSZip将文件添加到现有的zip存档中
- 如何避免为我的每个html文件添加ExpressJS app.get()
- 为文件添加下载选项
- javascript向文本文件添加/从中删除
- 将JavaScript文件添加到WordPress主题
- 将js文件添加到流星项目中
- jquery.filer编辑模式动态文件添加
- 使用javascript/jquery将外部文件添加到$_FILES数组中
- Joomla JS 文件添加
- 使用 spring 将 JS 文件添加到 JSP 文件时获得 404
- JavaScript JSzip将文件添加到每个循环
- 将本地 JavaScript 文件添加到页面
- 姜戈;在自定义小部件中向媒体文件添加变量