3

我有一个带有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'));
4

2 回答 2

2

您可以使用 jQuery 的:input选择器，它选择输入、选择和文本区域：

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);

于 2012-12-04T21:18:08.980 回答
1

只需组合选择器：

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

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

于 2012-12-04T21:17:05.157 回答