Получение значения от вложенной анонимной функции

Question

У меня есть список элементов с различными значениями данных, которые я пытаюсь вернуть при событии щелчка.Кажется, я не могу передать значение из события click родительской функции.Я могу просто делать все это неправильно.Мне просто нужно значение данных из каждого события щелчка, чтобы заменить значение моей переменной systemName.Может ли кто-нибудь помочь мне здесь?

function getSystemName(){
var systemName = '';
$('.pulldown li').bind('click', function(){
    var systemName = '';
    var systemName = $(this).find('a').data('value');
    console.log(systemName);
});
return systemName;
}

// Редактировать: я, вероятно, должен объяснить, что я пытаюсь получить это значение из события click для обновления содержимого на странице с помощью jquery .load, так что, возможно, какупоминается ниже .... Я не делаю это правильно, потому что я могу правильно зарегистрировать systemName по клику, но, похоже, он не обновляет содержимое страницы.Вот весь блок кода.

$.ajaxSetup ({  
    cache: false  
});  
var ajax_load = "<img src='.../images/130.gif' alt='loading...' align='middle' />";
var loadUrl = ".../content.php";  

var getSystemName = (function(){
var systemName = '';
$('.pulldown li').bind('click', function(){
   systemName = $(this).find('a').data('value');
   console.log(systemName);
});
return function() { return systemName };
})();

$("#results")  
    .html(ajax_load)  
    .load(loadUrl, "ki_systems=" +getSystemName());

Answer 1

В указанном коде каждый раз, когда вы вызываете getSystemName(), он будет связывать обработчик щелчков снова (что приводит к множественным обработчикам щелчков), а затем просто возвращает локальную переменную systemName, которая всегда будетбыть пустым.

Если вы говорите, что каждый раз, когда вы вызываете getSystemName(), вы хотите, чтобы он возвращал имя системы, связанное с тем, какой элемент li был выбран последним, тогда вы можете объявить переменную systemName какглобальная переменная и привязывает обработчик событий (один раз) за пределами getSystemName():

var systemName = '';

$('.pulldown li').bind('click', function(){
   systemName = $(this).find('a').data('value');
   console.log(systemName);
});

function getSystemName() {
   return systemName;
}

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

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

var getSystemName = (function(){
    var systemName = '';
    $('.pulldown li').bind('click', function(){
       systemName = $(this).find('a').data('value');
       console.log(systemName);
    });
    return function() { return systemName };
})();

// if no items have been clicked yet it will return an empty string by default
console.log( getSystemName() ); // ""
// click on an item with name "red"
console.log( getSystemName() ); // "red"
// click on an item with name "green"
console.log( getSystemName() ); // "green"

Этот последний блок может быть немного запутанным для непосвященных,Это установка getSystemName на все, что возвращается из выражения анонимной функции, которое выполняется немедленно (обратите внимание на дополнительные пустые скобки в конце).И что возвращается, так это простая функция, которая при вызове сама вернет systemName, которая объявлена ​​во внешней области видимости.Обработчик кликов также обновляет этот же systemName.Поэтому, когда вы на самом деле вызываете getSystemName(), вы вызываете маленькую однострочную функцию из оператора return.

Answer 2

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

Однако, вот как бы выглядело это, если бы я написал это, используя ваш стиль:

function getSystemName(callback) {
    $('.pulldown li').bind('click', function(){
        console.log(systemName);
        callback( $(this).find('a').data('value') );
    });
}

Итак, вместо кода такого типа:

console.log("System Name: ", getSystemName())

Вы бы получили:

getSystemName( function (name) { console.log("System Name: ", name); } );

Answer 3

Учтите, что во второй строке вы только привязываете функцию обратного вызова к событию click, а не выполняете код внутри этой функции.

Answer 4

Ну, я полагаю, вы пытаетесь установить значение, чтобы увидеть, какой узел был выбран, поэтому вам нужно изменить область действия вашей переменной systemName.Переместите его так, чтобы он был глобальным, например:

var systemName = '';
$('.pulldown li').bind('click', function(){
    systemName = $(this).find('a').data('value');
    console.log(systemName);
});

Answer 5

Удалить var из второго и третьего определений. Если вы используете var перед именем переменной, будет создан новый локальный экземпляр.

 systemName = '';
 systemName = $(this).find('a').data('value');
console.log(systemName);

Answer 6

Вы не можете.

Посмотрите на код.

1. Установите systemName в пустую строку
2. Когда aэлемент списка нажат установить systemName на что-то еще
3. Возврат systemName

Вы не можете заставить 3 ждать 2 .Вам нужно что-то сделать с данными в обработчике кликов и не пытаться их вернуть.