jQuery - Как использовать одну функцию, у которой в качестве селектора используется «$ (this)», но во второй функции $ (this) имеет область видимости - PullRequest
Новая
       22

jQuery - Как использовать одну функцию, у которой в качестве селектора используется «$ (this)», но во второй функции $ (this) имеет область видимости

0 голосов
/ 07 ноября 2018

Как вызвать первую функцию внутри второй функции с помощью this в качестве селектора в первой функции, которая вызывается во второй функции. Вот код: 

const _ERROR_MESSAGE = function(thisElement){ thisElement.after('<p class="error">'+thisElement.data("error-message")+'</p>') };

let _removeHtml = function(thisElement){ thisElement.next(".error").remove(); };

function validate(event){
  event.preventDefault();

  $("form input[data-required]").each(function(index){
    if($(this).val().length <= 0){
      if($(this).next().hasClass("error") == false){
      _ERROR_MESSAGE($(this));
      }
    }
    else{
      _removeHtml($(this));
    }
  });
}

Можно ли удалить аргумент $(this) из функции _ERROR_MESSAGE($(this)) и _removeHtml($(this)) и включить его в соответствующее определение функции и по-прежнему работать?

Любая помощь очень ценится!

1 Ответ

0 голосов
/ 07 ноября 2018

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

var $_this = $(this);

По-своему: 

const _ERROR_MESSAGE = function(){ this.after('<p class="error">'+this.data("error-message")+'</p>') };

let _removeHtml = function(){ this.next(".error").remove(); };

function validate(event){
  event.preventDefault();

  $("form input[data-required]").each(function(index){
    var $_this = $(this);
    if($_this.val().length <= 0){
      if($_this.next().hasClass("error") == false){
      _ERROR_MESSAGE.call($_this);
      }
    }
    else{
      _removeHtml.call($_this);
    }
  });
}

Если вы хотите более эффективный код и в той же функции 

function validate(event){
  event.preventDefault();
  //Validate each form input
  $("form input[data-required]").each(function(index){
    var $_this = $(this);
    var $_error = $_this.next(".error");
    if($_this.val().length == 0) {
        if($_error.length == 0)
            $_this.after('<p class="error">'+$_this.data("error-message")+'</p>');
    } else
         $_error.remove();
  });
}
...