Функция не определена

Question

У меня эта неперехваченная функция referenceerror не определена ошибка, которую не понимают.

Если у меня есть

$(document).ready(function(){
 function codeAddress() {
  var address = document.getElementById("formatedAddress").value;
  geocoder.geocode( { 'address': address}, function(results, status) {
   if (status == google.maps.GeocoderStatus.OK) {
    map.setCenter(results[0].geometry.location);
   }
  });
 }
});

и

<input type="image" src="btn.png" alt="" onclick="codeAddress()" />
<input type="text" name="formatedAddress" id="formatedAddress" value="" />

Когда я нажимаю кнопку, она возвращает «uncaught referenceerror».

Но если я помещу codeAddress () за пределы $ (document) .ready (function () {}, тогда оно будет работать отлично .

Мое намерение - поместить codeAddress () в document.ready.function.

Answer 1

Проблема в том, что codeAddress() не имеет достаточно возможностей для вызова с кнопки. Вы должны объявить это вне обратного вызова на ready():

function codeAddress() {
    var address = document.getElementById("formatedAddress").value;
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
        }
    });
}


$(document).ready(function(){
    // Do stuff here, including _calling_ codeAddress(), but not _defining_ it!
});

Answer 2

Как насчет удаления атрибута onclick и добавления идентификатора:

<input type="image" src="btn.png" alt="" id="img-clck" />

А твой сценарий:

$(document).ready(function(){
    function codeAddress() {
        var address = document.getElementById("formatedAddress").value;
        geocoder.geocode( { 'address': address}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
            }
        });
    }
    $("#img-clck").click(codeAddress);
});

Таким образом, если вам нужно изменить имя функции или что-то еще, не нужно прикасаться к html.

Answer 3

Ваша проблема здесь в том, что вы не понимаете, какую область вы устанавливаете.

Вы передаете функцию ready самой функции.В этой функции вы создаете другую функцию с именем codeAddress.Этот объект существует в области, в которой он был создан, а не в объекте окна (где все и его дядя могут вызвать его).

Например:

var myfunction = function(){
    var myVar = 12345;
};

console.log(myVar); // 'undefined' - since it is within 
                    // the scope of the function only.

Найдите здесьЕще немного об анонимных функциях: http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth

Другое дело, что я заметил, что вы используете jQuery на этой странице.Это значительно упрощает настройку обработчиков кликов, и вам не нужно ломать голову над настройкой атрибута «onclick» в HTML.Вам также не нужно делать метод codeAddress доступным для всех:

$(function(){
    $("#imgid").click(function(){
        var address = $("#formatedAddress").value;
        geocoder.geocode( { 'address': address}, function(results, status) {
           if (status == google.maps.GeocoderStatus.OK) {
             map.setCenter(results[0].geometry.location);
           }
        });
    });  
});

(Вы должны удалить существующий onclick и добавить идентификатор к элементу изображения, который вы хотите обработать)

Обратите внимание, что я заменил $(document).ready() его ярлыком, равным $() (http://api.jquery.com/ready/).). Затем метод click используется для назначения обработчика щелчка элементу.Я также заменил ваш document.getElementById на объект jQuery.

Answer 4

Вы должны написать тело этой функции за пределами ready ();

, потому что ready используется для вызова функции или для привязки функции с идентификатором привязки, подобным этому.

$(document).ready(function() {
    $("Some id/class name").click(function(){
        alert("i'm in");
    });
});

, ноВы не можете сделать это, если вы вызываете функцию «showAmount» onchange / onclick event

$(document).ready(function() {
    function showAmount(value){
        alert(value);
    }

});

Вы должны написать «showAmount» вне функции ready ();

function showAmount(value){
    alert(value);//will be called on event it is bind with
}
$(document).ready(function() {
    alert("will display on page load")
});

Answer 5

Пожалуйста, проверьте, правильно ли вы предоставили JS ссылки. Сначала файлы JQuery, а затем ваши пользовательские файлы. Поскольку вы используете '$' в своих методах js.