<div id="centre" class="layout">
    <div class="centreInner ">
        <div class="mainInner radius5 zsbreal">
            <div class="branchCommon branchCommon_pay radius5 mt20">
                <style>
                    body {
                        font: "Microsoft YaHei" 24px #333;
                    }
                    h1,
                    h2,
                    h3 {
                        font-weight: normal;
                    }
                    h1{ font-size: 24px;}
                    h2{ margin-top: 40px; font-size: 16px;}
                    h3{ margin-top: 30px; font-size: 14px; line-height: 30px;}
                    .clearfix:before,
                    .clearfix:after {
                        content: '.';
                        display: block;
                        visibility: hidden;
                        font-size: 0;
                        line-height: 0;
                        width: 0;
                        height: 0
                    }
                    .clearfix:after {
                        clear: both
                    }
                    .clearfix {
                        zoom: 1
                    }
                    .fl {
                        float: left;
                    }
                    .fr {
                        float: right;
                    }
                    .wap {
                        padding:10px;
                        margin: 10px auto;
                    }
                    .radiotype label {
                        background: url(http://nj.zsb.house365.com/source/zsb/images/v1.0/checkno.png) 5px 5px no-repeat;
                        display: inline-block;
                        cursor: pointer;
                        margin-right: 70px; font-size: 14px; color: #666; padding-bottom: 10px;
                    }
                    .radiotype label.on {
                        background: url(http://nj.zsb.house365.com/source/zsb/images/v1.0/check.png) 5px 5px no-repeat;
                        display: inline-block
                    }

                    .radiotype label input {
                        opacity: 0;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
                    }
                    button{ color: #fff; background: #08bee5; font-size: 16px; border-radius: 5px; width: 240px; height: 40px; border:none;}
                    .btn{ margin-top: 40px;}
                </style>
                <script>
                    function getradiotype(obj, type) {
                        if(!$(obj).hasClass(".on")) {
                            $(obj).siblings("label").removeClass("on");
                            $(obj).addClass("on");

                            $(obj).siblings("label").find('input[type="radio"]').prop('checked',false);
                            $(obj).find('input[type="radio"]').prop('checked',true);
                        }
                    }
                </script>
                <div class="wap">
                    <h1 align="center">学规免罚考核</h1>
                    <h2 style="font-size: 14px;">学规免罚规则说明：<br>
                        1、参加“学规免罚”的经纪人必须答对全部试题才可通过考核；<br>
                        2、单个账号每天仅有一次考试机会，未通过的可次日再考；<br>
                        3、通过考核后将会获得一次免扣罚机会，在放心看房源产生违规扣罚时自动使用；<br>
                        4、使用免扣罚机会的经纪人，放心看保证金在180天内将处于冻结状态，期间可正常使用放心看业务，到期后可自由提现；<br>
                        5、单个账号只可获得一次免扣罚机会；
                    </h2>
                    <h2>一、20题单选</h2>
                    <form action="/realHouse/paper_index" method="post" id="paper_title">
                    <?php if($paper_info_id){
                        foreach($paper_info_id as $key=>$value){ ?>
                    <h3 ><?=$key+1?>.<?=$paper_info[$value]['title']?> __________</h3><input type="hidden"  name="title_id[]" value="<?=$paper_info[$value]['title_id']?>"/>

                    <div id="jump_<?=$key+1?>" style="overflow：scroll;">
                        <div  class="clearfix radiotype">
                            <?php foreach($paper_info[$value]['answer'] as $key2=>$value2){?>
                            <label class="chose11 " onclick="getradiotype(this)">
                                <input type="radio"  name="select_num_<?=$paper_info[$value]['title_id']?>" value="<?=$value2['answer_type']?>"/>&nbsp;&nbsp;<?=$value2['answer_type_en']?> <?=$value2['answer']?>
                            </label>

                            <?php }?>
                        </div>
                    </div>

                    <?php }}else{?>
                    <div align="center">
                        <span>请耐心等待学规免罚考试开放!</span>
                    </div>
                    <?php }?>

                    <div align="center" class="btn"><button>提 交</button></div>
                    </form>
                </div>

            </div>
        </div>
    </div>
</div>
<script src="http://nj.zsb.house365.com/source/zsb/js/layer-v3.1.1/layer/layer.js"></script>
<script>
    $(".btn").on('click',function () {
        var length = $('form .clearfix').length;
        for(var i=1;i<=length;i++){
            // var num  =  $('.on').eq(i-1).find('input[type="radio"]').val()
            var chose = $('form .clearfix').eq(i-1).find("label").hasClass("on");
            if(chose == false){
                alert("请完成答题！");
                $("html,body").animate({
                    scrollTop: $("#jump_"+i).offset().top-120 }, {duration: 500,easing: "swing"});
                return false;
            }

        }
        layer.confirm('是否确认提交？', {
            title:'提示',
            btn: ['确定','取消'] //按钮
        }, function(){
            $("#paper_title").submit();
        });

        return false;
    })
</script>