Question

我有一张id="test"的表单。在表单中，我有一些select，input和textarea字段。

我想遍历每一个并检查它们是否为空，然后用它们做点什么。

var editTest= $('#test');

editGeneric(editTest);

var editGeneric= function(form){
    form.children().find('select').each(
        function(){
            var values = $(this).val();
            if(values === 'select one' || values === 'Select One' || values == 0 || values == 99){
                $(this).css('border', '1px solid red');
            }
        }
    );

    form.children().find('input').each(
        function(){
            var values = $(this).val();
            if(values === ''){
                $(this).css('border', '1px solid red');
            }
        }
    );

    form.children().find('textarea').each(
        function(){
            var values = $(this).val();
            if(values === ''){
                $(this).css('border', '1px solid red');
            }
        }
    );
}

这段代码可以满足我的需要，但你可以看到我重复了几次。

如何简化此代码，以便我可以将其与其他形式一起使用？

任何想法？，谢谢

编辑：谢谢所有

我把代码归结为：

var editGeneric= function(form){

    form.children().find(':input').each( function(){
            var values = $(this).val();

            if ($(this).is('select')){
                if(values === 'select one' || values === 'Select One' || values == 0){
                    $(this).css('border', '1px solid red');
                }
            }
            if ($(this).is('input') || $(this).is('textarea')){
                if(values === ''){
                    $(this).css('border', '1px solid red');
                }
            }
        }
    );

}

editGeneric($('test'));

Answer 1

你可以使用jQuery的:input选择器，它选择输入，选择和textareas：

form.children().find(':input').each( ...

唯一的问题是您的select验证稍有不同，因此您可以选中.is('select')来更改条件：

if (($(this).is('select')
   && (values === 'select one' || values === 'Select One'
   || values == 0 || values == 99) || !$(this).is('select') && values === ''))
   || !$(this).is('select') && values === '') {

您也不必使用form.children.find() ..您可以使用$("#test :input")或$(":input", form);

Answer 2

只需组合选择器：

form.children().find('select,input,textarea').each(function(){
        if(!$(this).val()){
            $(this).css('border', '1px solid red');
        }
    }
);

然后更改您的<select>，以便任何无效选项都具有空值或零值属性，而不是“选择一个”或99。

如何用find（）优化jquery代码？

2 个答案: