判斷所有input單選框是否全部選中

html

<div class="listWrap">
        <div class="list">
            <p class="title">第一題</p>
            <div class="boxWrap">
                <div class="box">
                    <input type="radio" name="1" questionId='q11' optionId='o14'>
                    <p class="1">11111</p>
                </div>
                <div class="box">
                    <input type="radio" name="1" questionId='q12' optionId='o14'>
                    <p class="1">富士達</p>
                </div>
                <div class="box">
                    <input type="radio" name="1" questionId='q13' optionId='o14'>
                    <p class="1">范德薩發生</p>
                </div>
                <div class="box">
                    <input type="radio" name="1" questionId='q14' optionId='o14'>
                    <p class="1">反倒是</p>
                </div>
            </div>
        </div>
        <div class="list">
            <p class="title">第二題</p>
            <div class="boxWrap">
                <div class="box">
                    <input type="radio" name="2" questionId='q21' optionId='o21'>
                    <p class="1">11111</p>
                </div>
                <div class="box">
                    <input type="radio" name="2" questionId='q22' optionId='o22'>
                    <p class="1">富士達</p>
                </div>
                <div class="box">
                    <input type="radio" name="2" questionId='q23' optionId='o23'>
                    <p class="1">范德薩發生</p>
                </div>
                <div class="box">
                    <input type="radio" name="2" questionId='q24' optionId='o24'>
                    <p class="1">反倒是</p>
                </div>
            </div>
        </div>
    </div>
    <p class="tijiao" onclick="tijiao()">提交</p>

CSS

.boxWrap{
            overflow: hidden;
        }
        .boxWrap .box{
            float: left;
            overflow: hidden;
        }
        .boxWrap .box input{
            float: left;
        }
        .boxWrap .box p{
            float: left;
        }
        .tijiao{
            width: 100px;
            height: 40px;
            background: palegoldenrod;
        }

JS

function tijiao(){
            var length = $('.listWrap .list').length
            for(var i = 0;i < length;i++){
                if($("input[name='"+ Number(i+1) +"']:checked").length == 0){
                    console.log(3242343)
                    alert('請填入完整信息後再提交')
                    return;
                }else{
                    console.log('這個完整')
                    if(Number(i+1) == length){
                        console.log("判斷最後一個了")
                        $('input:radio:checked').each(function(){
                            console.log($(this).attr('questionId'));  // 選中框中的值
                            console.log($(this).attr('optionId'));  // 選中框中的值
                        });
                        
                        aaaaaa()       //這裏寫我想執行的事件
                        return;
                    }
                    continue
                }
            }
        }

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章