Несколько функций в .on () без влияния на область видимости - PullRequest
0 голосов
/ 05 ноября 2018

В настоящее время я создаю динамическую веб-страницу и пытаюсь запускать несколько функций всякий раз, когда нажимается элемент с приложением class =. Приведенный ниже код работает, но он очень повторяется.

$(document).on("click", ".application", renderImage);
$(document).on("click", ".application", renderText);
$(document).on("click", ".application", renderCodeButton);
$(document).on("click", ".application", renderAppButton);

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

Вот функция renderImage, хотя все они очень похожи:

function renderImage () {
  $(".appPicture").empty();
  console.log(this);
  let applicationPic = $(this).attr("data-image")
  let img = $("<img>");
  img.addClass("appPic")
  img.attr("src", applicationPic);
  $(".appPicture").append(img);
}

Есть ли способ запуска нескольких функций с помощью одного события щелчка или способ вложения функций в мастер без влияния на область действия?

1 Ответ

0 голосов
/ 05 ноября 2018
$(document).on("click", ".application", function(){
    let scope = this;
    renderImage(scope);
    renderText(scope);
    renderCodeButton(scope);
    renderAppButton(scope);
});

function renderImage (scope) {
    $(".appPicture").empty();
    console.log(scope);
    let applicationPic = $(scope).attr("data-image")
    let img = $("<img>");
    img.addClass("appPic")
    img.attr("src", applicationPic);
    $(".appPicture").append(img);
}

вы можете сделать что-то вроде этого

...