javascript 函數參數奇怪的行為 ** 這是什么

Question

function updateView(campusId) {

        var latlng = CampusModel[campusId].latlng;

        var canvas = "campus-map";

        var zoom = 12;

        google.maps.event.addDomListener(window, 'load', mapInitialize(latlng, canvas, zoom));

...
}

我最初發布了一張圖片，顯示當函數 exe 時，campaignId 參數為 1。

一旦在功能塊中，[campusId] 就變為未定義。

有人在這里看到問題嗎？

CampusModel 已定義。

完整的代碼行：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>MVC Example</title>

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

    <script>

    /* MODEL */
    var CampusModel = {
        1:  {
                name: 'a Campus',
                address: 'somewhere',
                lating: { lat: 41.1693913, lng: -127.8672693 }
            },
        2:  {
                name: 'b Campus',
                address: 'somewhere2',
                lating: { lat: 19.2833298, lng: -124.1152499 }
            },
    };

    /* CONTROLLER */
    function initView() {
        var selector = document.getElementById('campuses-dropdown');
        var options = '<option>[ Select a Campus ]</option>';
        for (var campusId in CampusModel) {
            options += '<option value="' + campusId + '">';
            options += CampusModel[campusId].name;
            options += '</option>';
        }
        selector.innerHTML = options;
        selector.onchange = function() { updateView(this.value); };
    }

    </script>

    <script>
    //Helper functions

    // Initialize google map.
    function mapInitialize(latlng, canvas, zoom){

        var mapCanvas = document.getElementById(canvas);

        var options = {
          center: latlng,
          zoom: zoom,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var campusMap = new google.maps.Map(mapCanvas, options);

        var marker = new google.maps.Marker({
            position: latlng,
            map: campusMap,
            title: 'BCIT'
        });


        }

    function updateView(campusId) {

        var latlng = CampusModel[campusId].latlng;

        var canvas = "campus-map";

        var zoom = 12;

        google.maps.event.addDomListener(window, 'load', mapInitialize(latlng, canvas, zoom));

        google.maps.event.addDomListener(window, "resize", function() { 

            var center = campusMap.getCenter();
            google.maps.event.trigger(campusMap, "resize");
            campusMap.setCenter(center); 

            });

    }

    </script>

</head>

<body onload="initView()">

    <!-- VIEW -->
    <div>
        <select id="campuses-dropdown"></select>
    </div>
    <div id="campus-map">

    </div>

</body>

</html>

selector.onchange = function() { updateView(this.value); };

“this”在原始代碼中指的是哪里？ 我以為是指向選擇器。 但也許不是？

仍然 this.value 將正確的參數傳遞給函數。

根本原因是什么

Answer 1

因為您已經使用campusId作為參數定義了該函數， campusId除非您在調用該函數時實際傳遞了某個值，否則該函數內部的值將是undefined 。

編輯- 現在您已經發布了所有代碼，問題是什么就很明顯了。 您將“updateView”函數綁定為事件處理程序，並期望（錯誤地） this在調用時引用“選擇器”對象。 你需要的是一個像你用.bind()得到的解決方案：

    selector.onchange = function() { updateView(this.value); }.bind(selector);

javascript 函數參數奇怪的行為 ** 這是什么

問題描述

1 個解決方案

解決方案1
0 2015-09-28 17:52:51

javascript 函數參數奇怪的行為 ** 這是什么

問題描述

1 個解決方案

解決方案1 0 2015-09-28 17:52:51

解決方案1
0 2015-09-28 17:52:51