Передача переменных для функции в JavaScript

ProgramBox

Передача переменных для функции в JavaScript

Post author:admin
Запись опубликована:27 апреля, 2023
Post category:Вопросы по программированию

#javascript #google-maps

#javascript #google-карты

Вопрос:

У меня есть следующий код в теле

 <div id="searchresult" onmouseover="changeMarker(marker1)">

и следующее в заголовке

 function changeMarker(marker) {
    alert(marker);
}

Теперь, когда я наведу курсор мыши на div, я получаю следующую ошибку в консоли javascript

 Uncaught ReferenceError: marker1 is not defined

Если вместо этого у меня есть следующее, где функция не принимает переменные, вызывается окно предупреждения.

 function changeMarker() {
    alert('hi');
}

<div id="searchresult" onmouseover="changeMarker()">

Я где-то допустил ошибку?

Редактировать

Я забыл, что определил marker1 в initialize () следующим образом (я использую Google maps v3 api)

 var marker1 = new google.maps.Marker({  

                position: new google.maps.LatLng(1.288693,103.846733),

                map: map,

                icon: "http://chart.apis.google.com/chart?chst=d_map_pin_letteramp;chld=1|c41200|ffffff"

            });

Это остальная часть кода, который я действительно использую:

 <div id="searchresult" onmouseover="changeMarker(marker1)">

и функция

 function changeMarker(marker) {
            var icon = new Google.maps.MarkerImage({ url:"http://chart.apis.google.com/chart?chst=d_map_pin_letteramp;chld=1|ffffff|c41200"});
            marker.setIcon(icon);
        }

Я получаю ту же ошибку: неперехваченная ошибка ссылки: marker1 не определен

1. вы никогда marker1 нигде не определяли, так откуда он знает, что передавать? Вы никогда не говорили, что это за переменная marker1 . Если вы пытаетесь отправить строку в свою функцию, то она должна быть заключена в кавычки: <div id="searchresult" onmouseover="changeMarker('marker1')">

2. marker1 Определено ли это как глобальное? Это в script теге, который предшествует div тегу?

3. да, marker1 и функция changeMarker определены в теге script, который находится в head … как мне сделать marker1 глобальным?

4. marker1 определяется в функции initialize(), которая называется <body onLoad=»инициализировать()»>

Ответ №1:

Я забыл, что определил marker1 в initialize()

Тогда область ее действия ограничена initialize и недоступна в более широкой области.

Вы могли бы удалить var , чтобы сделать его глобальным, но вам, вероятно, было бы лучше назначить свой обработчик событий с JS внутри initialize вместо использования атрибутов HTML для этого.

1. я попытался удалить ‘var’, как вы предложили, и получил ошибку ‘Uncaught ReferenceError: Google не определен’…

2. Мне пришлось бы просмотреть весь код, чтобы понять, почему это происходит. Придерживайтесь подхода, который, как я сказал, был лучше с самого начала. Используйте JS для подключения обработчиков событий.

3. Я попытался добавить следующий код внутри initialize(): document.getElementById(«searchresult»).onmouseover= function() {changeMarker(marker1);} Я получаю ошибку: Ошибка неперехваченной ссылки: Google не определен

4. Когда я использую следующее, это работает: document.getElementById(«searchresult»).onmouseover= function() {location.href=»page2.htm «;}

Ответ №2:

Похоже, этот код работает правильно:

 <script>
    function changeMarker(marker) {
        alert(marker);
    }

    var marker1 = 'Test Data';
</script>

<style>
    #searchresult {
        background-color: red;
    }
</style>

<div id="searchresult" onmouseover="changeMarker(marker1)">
    Test Box
</div>

Однако что-то подобное не сработает, потому что marker1 область действия ограничена обратным вызовом Google.

 <script>                                                                                     
    function changeMarker(marker) {                                                          
        alert(marker);                                                                       
    }                                                                                        

    google.setOnLoadCallback(function() {                                                    
        var marker1 = 'Test Data';
    });
</script>

Чтобы исправить это, вы могли бы сделать:

 <script>                                                                                     
    function changeMarker(marker) {                                                          
        alert(marker);                                                                       
    }                                                                                   

    var marker1;

    google.setOnLoadCallback(function() {                                                    
        marker1 = 'Test Data';
    });
</script>

1. будет ли это работать, если я сделаю переменную marker1 глобальной? как мне сделать это глобальным?

2. Я добавил дополнительный фрагмент кода. Я не силен в javascript, поэтому, возможно, есть более приятный способ сделать это, но я включил простой способ.

3. Я попробовал это, и я получаю ошибку: неперехваченная ошибка ссылки: Google не определен

4. Вероятно, это другая проблема. Возможно, вы неправильно загружаете Google jsapi?

5. Я избавился от ошибки Google … это потому, что я использовал Google с заглавной буквы в функции changeMarker

Ответ №3:

Я думаю, это поможет:

<div id="searchresult" onmouseover="function(){changeMarker(marker1)}">