weixin_58648225 2023-02-23 21:03 采纳率: 89.2%
浏览 16
已结题

javascript触发的select的requierd问题

假设目前有两行select分别为id cat 和 cow,js控制当value时空的option被选择时触发required输出错误信息
js部分省略

                    <select name="cat1" id="cat1" required>
                        <option value=""></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                      </select>
                    <select name="cat2" id="cat2" required>
                        <option value=""></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                      </select>
                    <select name="cow1" id="cow1" required>
                        <option value=""></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                      </select>
                      <select name="cow2" id="cow2" required>
                        <option value=""></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                      </select>
                     <div class="errorMsg"></div>
                      <span>一个触发页面跳转页面</span>

<script>
    var validationObj = function(args) {
            this.validObj = args.validObj;
            this.realtime = args.realtime || null;
            if (this.realtime) {
                this.validObj.required = function() {
                    return true;
                }
            }
        };
    validationObj.prototype = {
        valid: function(item) {
            if (!this.realtime) {
                item.closest('.inner').removeClass('error');
            }
            item.removeClass('error');
            item.find('input').removeClass('error');
            item.siblings('input').each(function() {
                $(this).removeClass('error');
            })
            item.parent().removeClass('admission').removeClass('invalid');
            item.closest('.section').children('p.errorMessage').remove();
            if (item.val() !== "") {
                item.parent().addClass('admission');
            }
        },
        cat1: function(){
            this.validObj.challenge('cat1', 'cat1') && this.validObj.required();
        },
        cat2: function(){
            this.validObj.challenge('cat2', 'cat2') && this.validObj.required();
        },
        cow1: function(){
            this.validObj.challenge('cow1', 'cow1') && this.validObj.required();
        },
        cow1: function(){
            this.validObj.challenge('cow1', 'cow1') && this.validObj.required();
        },
$.fn.form_check = function(e) {
            var e = e || window.event;
        var page = $.mobile.activePage;
        $('div.inner,input', page).removeClass('error');
        $('p.errorMessage,div.errorBox', page).remove();
        $('span', page).removeClass('admission').removeClass('invalid');
        if (e && $(e.target).closest('a').hasClass('back')) {
            return true;
        }
        var v = new Validator();
        var valid1 = new validationObj({
            validObj: v
        });
        valid1.cat1();
        valid1.cat2();
        valid1.cow1();
        valid1.cow2();
        return !v.has_errors();
    };

这样的话四个select都会在未输入时显示未输入错误信息,请问能否在cat1 cat2第一行的select都被选择非空的option的时候,禁用掉cow的validiton,也即是说即使第二行的cow的select选择value时空的option时也可以跳转,谢谢

  • 写回答

3条回答 默认 最新

  • CSDN专家-showbo 2023-02-23 21:41
    关注
           $.fn.form_check = function (e) {
            var e = e || window.event;
            var page = $.mobile.activePage;
            $('div.inner,input', page).removeClass('error');
            $('p.errorMessage,div.errorBox', page).remove();
            $('span', page).removeClass('admission').removeClass('invalid');
            if (e && $(e.target).closest('a').hasClass('back')) {
                return true;
            }
            var v = new Validator();
            var valid1 = new validationObj({
                validObj: v
            });
            valid1.cat1();
            valid1.cat2();
            if (cat1.value != '' && cat2.value != '') {//都不为空再执行验证,同时加上required property
                $('#cow1,#cow2').prop('required',true)
                valid1.cow1();
                valid1.cow2();
            }
            else {//移除required property
                $('#cow1,#cow2').prop('required', false)
            }
            return !v.has_errors();
        };
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(2条)

报告相同问题?

问题事件

  • 系统已结题 3月3日
  • 已采纳回答 2月23日
  • 创建了问题 2月23日

悬赏问题

  • ¥15 帮我写一个c++工程
  • ¥30 Eclipse官网打不开,官网首页进不去,显示无法访问此页面,求解决方法
  • ¥15 关于smbclient 库的使用
  • ¥15 微信小程序协议怎么写
  • ¥15 c语言怎么用printf(“\b \b”)与getch()实现黑框里写入与删除?
  • ¥20 怎么用dlib库的算法识别小麦病虫害
  • ¥15 华为ensp模拟器中S5700交换机在配置过程中老是反复重启
  • ¥15 java写代码遇到问题,求帮助
  • ¥15 uniapp uview http 如何实现统一的请求异常信息提示?
  • ¥15 有了解d3和topogram.js库的吗?有偿请教