Вызов функции jQuery при нажатии div на div div

Question

У меня есть функция проверки jQuery.

function validationCheck() { 
    if($(this).val()==''){ 
    $(this).addClass('validation-error'); 
    return false; 
    } 
} 

Мне нужно вызвать эту функцию, когда я нажимаю кнопку.

$('#stepbutton1').click(function(){ 
    $("#geocomplete").validationCheck(); //Call the function (this wont work) 
}); 

Как я могу вызвать эту функцию для проверки проверки на ид stepbutton1?

Answer 1

Добавить функцию JQuery prototype, это будет небольшой jQuery plugin

$.fn.validationCheck = function() { 
 
    var $this = $(this); 
 
    
 
    if ($this.val() == ''){ 
 
    $this.addClass('validation-error'); 
 
    return false; 
 
    } 
 
} 
 

 
$('#stepbutton1').click(function(){ 
 
    $("#geocomplete").validationCheck(); 
 
});

.validation-error { 
 
    border: 1px solid #f00; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button id="stepbutton1">stepbutton1</button> 
 
<input id="geocomplete" />

Answer 2

Вам необходимо пройти элемент в функцию в качестве аргумента:

function validationCheck(element) { 
    if($(element).val()==''){ 
     $(this).addClass('validation-error'); 
     return false; 
    } 
} 

, а затем вызвать его соответствующим образом:

$('#stepbutton1').click(function(){ 
    validationCheck('#geocomplete'); 
}); 

Answer 3

Значение this не является входным, если в контексте функции validationCheck(). Просто передайте целевой ввод в функцию проверки, а не сделайте его приемником. http://jsfiddle.net/32z20jcz/1/

$('#stepbutton1').click(function() { 
    validationCheck($('#geocomplete')); 
}); 

function validationCheck(input) { 
    if (input.val() == '') { 
     input.addClass('validation-error'); 
     return false; 
    } 
}