Question

我有一个jQuery验证功能。

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

单击按钮时我需要调用此函数。

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

如何调用此函数来检查ID stepbutton1上的验证？

Answer 1

您需要将一个元素作为参数传递给函数：

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

然后相应地调用它：

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

Answer 2

向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 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;
    }
}

在div上点击不同的div调用jQuery函数

3 个答案: