代码之家  ›  专栏  ›  技术社区  ›  Dipak

jquery根据自定义函数返回true或false

  •  0
  • Dipak  · 技术社区  · 6 年前

    我想在自定义函数中绑定以下代码,如果字段有值,则返回true;如果字段为空,则返回false。只使用一个变量进行验证很容易。但在验证两个数组时,我认为它只能是自定义函数。我认为代码也会变得不必要的冗长,因为缺少自定义函数。请引导我。

    $(document).on('click', '.subadd', function(){
    
        //I want to bind this code in function 
        var sid = [];
            $('input[name="sid[]"]').each(function(){
            if(!$(this).val()){
                $(this).addClass('border1red');
                return false;
            };
            if($(this).val()){
                $(this).removeClass('border1red');
                sid.push(this.value);
            }
        });
    
        var title = [];
            $('input[name="title[]"]').each(function(){
            if(!$(this).val()){
                $(this).addClass('border1red');
                return false;
            };
            if($(this).val()){
                $(this).removeClass('border1red');
                title.push(this.value);
            }
        });
     //function
    
     //if function return true
    
        if(sid.length && title.length){
            $('table#menutable tr:last').after("<tr>.....</tr>");
        };
    });
    
    1 回复  |  直到 6 年前
        1
  •  1
  •   SystemGlitch    6 年前

    首先你可以缩短你的 each 循环。

    if(!$(this).val()){
        $(this).addClass('border1red');
        return false;
    } else {
        $(this).removeClass('border1red');
        title.push(this.value);
    }
    

    您也可以使用选择器和数组作为参数为其生成函数。

    $.validate = function(selector, array) {
        $(selector).each(function(){
            if(!$(this).val()){
                $(this).addClass('border1red');
                return false;
            } else {
                $(this).removeClass('border1red');
                array.push(this.value);
            }
        }
    }
    

    最后,代码的主要部分如下所示:

    var sid = [];
    var title = [];
    $.validate('input[name="sid[]"]', sid);
    $.validate('input[name="title[]"]', title);
    if(sid.length && title.length){
        $('table#menutable tr:last').after("<tr>.....</tr>");
    };