0

我正在尝试创建各种混搭...我希望这些函数位于一个文件中,但是当我添加我的 Ajax 函数(中途)时,什么也没有显示。

我还想用 jQuery 显示它们,并且顶部函数(带有标记和信息的谷歌地图)在我添加底部函数之前都可以工作。

我应该像谷歌那样将它们添加到 (function () {} ) 中吗? () 是什么?在 googlemap 函数的末尾?

当我在我的代码中调用我的函数时,我将如何调用 ajax 进行预览,因为在 Google 中调用了 window.onload。

我知道我可以使用 $.ready function(){} 但我只是将函数名称放在 .ready function { }

我不确定如何在一个文件中添加所有功能并使其工作。基本上

这是代码:

(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";
                        }
                    }
4

1 回答 1

3

这取决于您添加功能的原因。但这里有一个简单的公式。如果您希望仅在文档就绪时调用函数,并希望在加载文档时调用它们一次。然后将它们添加为“匿名函数”

例子:

$(function () {
    //you code
    ...............
    // you can call your named functions also here. 
    //like
    somefunction();
});

但是,如果您希望稍后在文档已经加载时调用它们。然后添加“命名函数”

例子:

function somename()
{
    ............
}

在这两种情况下,您都可以将它们放在一个文件中,并且关于();函数末尾的 ,这是一种在 JavaScript 中立即调用匿名函数的方法,就像document.ready在 jQuery 中一样。

于 2012-05-11T17:08:41.813 回答