вызов функции пространства имен javascript из jquery

Question

вызов функции пространства имен javascript из jquery

0

Я хочу заполнить диалог jquery ui modal со значениями из массива в этом модуле:

var WsdArrays = function() {
     var arr = [["the boy is going home", "wsd_aud1"],
      ["You and I are friends", "wsd_aud2"],
      ["He has a book of mine", "wsd_aud3"],
      ["He will run to his home", "wsd_aud4"],
      ...          ];         
    return {
        values: function(index1, index2) {
        return arr[index1][index2];
        }
    };
}();

это работает нормально, когда вызывается так:

console.log(WsdArrays.values(0, 0));

но он не работает, когда функция модуля вызывается внутри оператора jquery с аргументами, генерируемыми событием click jquery, таким образом:

jQuery("span.ws_dialog_icon").on("click",function(evnt) {
  jQuery("div#ws_dialog").dialog("open");
  evnt.stopPropagation();
  var elementId = evnt.target.id,
      index1 = elementId.substr(7), //strips chars from ids like "wsd_img01"
      index2 = 0,
      arrayVals = WsdArrays.values(index1, index2);
  jQuery("div#wsd_text").text(arrayVals);
});

Что нужно изменить здесь?

RoyS 14 дек. 2013, в 02:26

Источник

0

but it does not work when the module function is called within a jquery statement , вызывает ли оно исключение или просто возвращает неправильный результат? Что говорит консоль? Какие значения вы передаете? Вы пытались добавить console(index1, index2) внутри вашей функции values ? Кроме того, где определяется WsdArrays ? Вы говорите, namespaced function где находится пространство имен? Он находится в том же замыкании, что и код jQuery, в том же файле или полностью отдельно?
Nope 14 дек. 2013, в 00:56

Теги:

javascript

jquery

module

3 ответа

Ещё вопросы

but it does not work when the module function is called within a jquery statement , вызывает ли оно исключение или просто возвращает неправильный результат? Что говорит консоль? Какие значения вы передаете? Вы пытались добавить console(index1, index2) внутри вашей функции values ? Кроме того, где определяется WsdArrays ? Вы говорите, namespaced function где находится пространство имен? Он находится в том же замыкании, что и код jQuery, в том же файле или полностью отдельно?

Khanh TO · Answer 1 · 2013-12-14T00-05-00.000Z

Попробуйте parseInt:

index1 = parseInt(elementId.substr(7)),

Причина заключается в том, что ваш index1 без parseInt является строкой "01" после вызова elementId.substr(7) для "wsd_img01". Это вызовет проблему, так как arr["01"] возвращает undefined что вызывает исключение, когда вы вызываете arr["01"][index2]. Как вы можете видеть в следующей DEMO

Когда мы используем parseInt, index1 становится 1, что не вызывает проблемы.

DEMO

Thomas Junk · Answer 2 · 2013-12-14T00-02-00.000Z

Я думаю, что scoping здесь действительно главный вопрос. Но вместо того, чтобы засорять window/глобальное пространство имен, я предлагаю использовать другое пространство имен:

var app=function($){
    var WsdArrays = function() {
        var arr = [["the boy is going home", "wsd_aud1"],
        ["You and I are friends", "wsd_aud2"],
        ["He has a book of mine", "wsd_aud3"],
        ["He will run to his home", "wsd_aud4"],
        ...          ];         
        return {
                 values: function(index1, index2) {
                         return arr[index1][index2];
               }
        };
    }();
    $("span.ws_dialog_icon").on("click",function(evnt) { 
       $("div#ws_dialog").dialog("open");
       evnt.stopPropagation();
       var elementId = evnt.target.id,
       index1 = elementId.substr(7), //strips chars from ids like "wsd_img01"
       index2 = 0,
       arrayVals = WsdArrays.values(index1, index2);
       $("div#wsd_text").text(arrayVals);
   });
}(jQuery);

Таким образом, нет необходимости использовать глобальную область видимости, а WsdArrays видна для onClick.

Кроме того: почему вы не используете словарь-подход?

var WsdArrays=function(){
    var whatEverString={
         "wsd_aud1","the boy is going home",
         "wsd:auds","you and i are friends"
    };
    return {
        values:function(id){ return whatEverString[id]; }
    }
}

Другое дело: почему вы инкапсулируете простую функцию в IFFE? Только по причинам, связанным с именами? Простой функции будет достаточно.

код не работает (после удаления ...) диалоговое окно не отображается, тогда как до этого диалоговое окно отображалось, но было пустым. Я использую массив, потому что я думал, что он будет получать значения быстрее, чем буквальный объект. @ Томас Джанк
ОК, диалоговое окно отображается, но содержимое не отображается. @ Thomas Junk
не могли бы вы создать jsfiddle.net , где мы увидим еще немного вашего кода и что не работает.

Jordan Ramstad · Answer 3 · 2013-12-13T22-35-00.000Z

Используйте window чтобы сделать его более глобальным.

Поэтому установите его так:

window.WsdArrays = function() {
     var arr = [["the boy is going home", "wsd_aud1"],
      ["You and I are friends", "wsd_aud2"],
      ["He has a book of mine", "wsd_aud3"],
      ["He will run to his home", "wsd_aud4"],
      ...          ];         
    return {
        values: function(index1, index2) {
        return arr[index1][index2];
        }
    };
}();

Таким образом, он будет находиться в глобальном пространстве имен, если он будет создан в рамках другой функции, это также сработает. Если вы объявите его с var внутри другой функции, он будет доступен только в этой функции.

Диалоговое окно отображается, но не заполняется. JSHint говорит, что WsdArrays не определена ?? Первоначально я получал это сообщение :( @Jordan Ramstad