JQuery отдельный JS файлы

Question

У меня есть 2 отдельные JS файлы:

    //first.js 
    $(document).ready(function(){ 

$("#someButton").click(function(event){ 

    showMessageBox("test"); 
     }); 
    }); 

и второй

$(document).ready(function(){ 

alert('csdfsdf'); 

function showMessageBox(msg) { 
    alert("something"); 
    $('#messageBox').text(msg); 
    $('#messageBox').dialog('open'); 
} 


    $("#messageBox").dialog({ 
    bgiframe: true, 
    autoOpen: false, 
    height: 200, 
    width: 300, 
    modal: true, 
    buttons: { 
    'Ok': function() { 
    $(this).dialog('close'); 
    window.location.reload(true); 
      } 
    } 
    }); 


}); 

функция ShowMessage() во втором файле я хотел бы использовать его в других jquery- js-файлы стиля, как в первом. Проблема в том, что я получаю сообщение об ошибке, что showMessage() не определено, когда я пытаюсь его использовать.

Это происходит с любой другой функцией, которую я вызываю, которая находится в отдельном файле в стиле jquery. Если функция showMessage() не находится внутри $ (document) .ready (function() {.....}); то он вызывается, но тогда он неприменим с помощью jquery.

Я также удостоверяюсь, что файл, содержащий функцию showMessage(), загружается перед файлом, который его вызывает.

Любая помощь будет оценена по достоинству.

Спасибо.

Answer 1

Из того, что я вижу, вы используете неправильное имя функции в своем вызове, заявленная функция - showMessageBox, и вы вызываете showMessage. Кроме того, вам нужно объявить функцию вне блока document.ready, поэтому она доступна в глобальном контексте.

Функция, объявленная из одного document.ready, не может быть доступна из другого блока document.ready, я уже провел этот тест раньше. Смотрите этот ответ:

Can you have multiple $(document).ready(function(){ ... }); sections?

Answer 2

Вы определяете функцию ShowMessageBox() внутри готового метода документа во 2 файла. Перемещение декларации за пределами готового метода должно позволить вам получить к ней доступ. Кроме того, вы вызываете ShowMessage(), но определили метод ShowMessageBox().

Answer 3

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

Решение состоит в том, чтобы переместить его в область действия, доступ к которой может выполнять обе функции. Самый простой способ добиться этого - разместить его вне других функций, которые придают ему глобальный охват.

Получение правильного названия (showMessage против showMessageBox) часто помогает.

Answer 4

Попробуйте реорганизовать, как работают ваши функции. Вы могли бы иметь первый файл "util.js", как (OutSite и без функции document.ready):

function showMessageBox(msg,msgBox) { 
    alert("something"); 
    $(msgBox).text(msg); 
    $(msgBox).dialog('open'); 
} 

И затем, на файлы, вам это нужно:

//first.js 
$(document).ready(function(){ 

$("#someButton").click(function(event){ 

    showMessage("test","#messageBox"); 
    }); 
}); 

Я d say, потому что вы загружаете эту функцию после того, как документ был загружен, существует порядок проблемы с приоритетом для вызова его в первом файле, пока он еще не загружен в память (даже если вы сначала поместите этот файл). Выдвиньте документ.Функция ready() позволяет вам определить ее, как только она будет прочитана браузером, и в области globalesque.

Answer 5

Попробуйте использовать следующий код. В основном, поставьте в основной объем свою функцию showMessage и используйте ее в любом месте. Вы определяли showMessage внутри области $ (document) .ready(), что делало ее недопустимой извне.

//first.js 
function showMessage(msg) { 
    $('#messageBox').text(msg); 
    $('#messageBox').dialog('open'); 
} 


$(document).ready(function(){ 
    $("#someButton").click(function(event){ 
     showMessage("test"); 
    }); 
}); 

$(document).ready(function(){ 
    $("#messageBox").dialog({ 
     bgiframe: true, 
     autoOpen: false, 
     height: 200, 
     width: 300, 
     modal: true, 
     buttons: { 
      'Ok': function() { 
       $(this).dialog('close'); 
       window.location.reload(true); 
      } 
     } 
    }); 
}); 

Answer 6

Я только что пришел через Google к этому до сих пор нерешенной проблеме, чтобы опубликовать решение:

Если у вас есть 2 разных Готовые блоки, и вы хотите, чтобы вызвать функцию, помещенный в другом готовом-блоке, то просто определите вызываемую функцию немного более глобальную.

Это можно сделать, используя window.YourFunctioName=function(){...}.

В вашем случае решение определить MessageBox более глобальный: ` $ (документ) .ready (функция() {

window.showMessageBox=function(msg) {... 

`