Как мне успешно выбрать вновь созданный элемент с помощью Mustache, используя jQuery? - PullRequest
0 голосов
/ 15 мая 2018

Я генерирую некоторый HTML на основе шаблона усов, например:

function generate_hello(element) {
    var template = jQuery('#hello_template');
    return mustache(template.html(), {
        tooltip: 'Hello'
    });
    ..nothing gets executed here, no selecting in jQuery, no nothing.
}

Итак, рождается элемент:

<input type='button' value='Hello' class='show'>

!Круто.

За исключением того, что это не сработает, если я хочу поставить его после return mustache...

jQuery('.show');

И не делает этого:

$('.show');

И по праву так,A return означает остановку исполнения.Теперь я добавил этот селектор до и после возврата, удалил возврат (не могу удалить возвращение, потому что тогда он просто не выводит HTML), но ничего не работает.

Как выбратьмой недавно созданный элемент, чтобы играть с ним?

Ответы [ 2 ]

0 голосов
/ 15 мая 2018

Пожалуйста, проверьте комментарии, а также другой ответ для ценной информации.

Проблема на самом деле не в коде, а в том, как я спроектировал мою систему , errr, logic.

Этот код вызывается в функции-оболочке (на один уровень выше) следующим образом:

var markup = $(window[callback](e.currentTarget));
markup.attr('data-screen', callback);
wrapper.append(markup);

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

Требуетсяданные из моего HTML:

<div class="test" data-callback="generate_markup">

И только что выполнил тот обратный вызов, который является моим оригинальным generate_hello.Ничего более.

Решение здесь состоит в том, чтобы после завершения вывода выполнить еще один обратный вызов, поэтому после моего wrapper.append(markup); я просто вызову свой второй обратный вызов:

var markup = $(window[callback](e.currentTarget));
markup.attr('data-screen', callback);
wrapper.append(markup);
secondary_callback_after_markup_is_done();

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

0 голосов
/ 15 мая 2018

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

Вот как вы это делаете

$('body').on('click', '.show', function() {
  alert("Clicked on element with class show")
});

Обновление:

function generate_hello(element) {
    var template = jQuery('#hello_template');
    return mustache(template.html(), {
        tooltip: 'Hello'
    });
    ..nothing gets executed here, no selecting in jQuery, no nothing.
}

здесь ничего не выполняется, нет выбора в jQuery, нет ничего

Это потому, чтоВы возвращаетесь из функции.И ничего не выполняется после оператора return.Напишите свой код в какой-то другой функции и вызовите его после функции generate_hello.

Что-то вроде

generate_hello();
someOtherFunction
...