html jquery 数量范围选择(可用于薪资范围,价格范围)

<form class="layui-form"> 
<div class="form-row">
                <div class="form-group col-md-6">
                    <label>工作性质</label><br />
                    {volist name='gongzuoxingzhi' id='gzxz'}
                    <label><input type="radio" class="custom-radio"   value="{$gzxz.config_id}" {if $jianli_info.gongzuoxingzhi eq $gzxz.config_id} checked{/if} name="gongzuoxingzhi">{$gzxz.value}</label>
                    {/volist}
                </div>
                <div class="form-group col-md-2">
                    <label>最低薪资</label>
                    <div class="layui-input-inline">
                        <select name="smoney" lay-filter="smoney">
                            <option value="面议">面议</option>
                            <option value="1">1k</option>
                            <option value="2">2k</option>
                            <option value="3">3k</option>
                            <option value="4">4k</option>
                            <option value="5">5k</option>
                            <option value="6">6k</option>
                            <option value="7">7k</option>
                            <option value="8">8k</option>
                            <option value="9">9k</option>
                            <option value="10">10k</option>
                            <option value="11">11k</option>
                            <option value="12">12k</option>
                            <option value="13">13k</option>
                            <option value="14">14k</option>
                            <option value="15">15k</option>
                            <option value="16">16k</option>
                            <option value="17">17k</option>
                            <option value="18">18k</option>
                            <option value="19">19k</option>
                            <option value="20">20k</option>
                            <option value="21">21k</option>
                            <option value="22">22k</option>
                            <option value="23">23k</option>
                            <option value="24">24k</option>
                            <option value="25">25k</option>
                            <option value="26">26k</option>
                            <option value="27">27k</option>
                            <option value="28">28k</option>
                            <option value="29">29k</option>
                            <option value="30">30k</option>
                            <option value="31">31k</option>
                            <option value="32">32k</option>
                            <option value="33">33k</option>
                            <option value="34">34k</option>
                            <option value="35">35k</option>
                            <option value="36">36k</option>
                            <option value="37">37k</option>
                            <option value="38">38k</option>
                            <option value="39">39k</option>
                            <option value="40">40k</option>
                            <option value="41">41k</option>
                            <option value="42">42k</option>
                            <option value="43">43k</option>
                            <option value="44">44k</option>
                            <option value="45">45k</option>
                            <option value="46">46k</option>
                            <option value="47">47k</option>
                            <option value="48">48k</option>
                            <option value="49">49k</option>
                            <option value="50">50k</option>
                            <option value="60">60k</option>
                            <option value="70">70k</option>
                            <option value="80">80k</option>
                            <option value="90">90k</option>
                            <option value="100">100k</option>
                            <option value="110">110k</option>
                            <option value="120">120k</option>
                            <option value="130">130k</option>
                            <option value="140">140k</option>
                            <option value="150">150k</option>
                            <option value="160">160k</option>
                            <option value="170">170k</option>
                            <option value="180">180k</option>
                            <option value="190">190k</option>
                            <option value="200">200k</option>
                            <option value="210">210k</option>
                            <option value="220">220k</option>
                            <option value="230">230k</option>
                            <option value="240">240k</option>
                            <option value="250">250k</option>
                        </select>
                    </div>
                </div>
                <div class="form-group col-md-2">
                    <label>最高薪资</label>
                    <div class="layui-input-inline">
                        <select name="emoney" id="emoney" lay-filter="emoney">
                            <option value="4">4K</option>
                            <option value="5">5K</option>
                            <option value="6">6K</option>
                            <option value="7">7K</option>
                        </select>
                    </div>
                </div>

            </div>
</form>

JS

var form = layui.form;
        form.on('select(smoney)',function (data) {
            $('#emoney').removeAttr('disabled');
            var options=$("[name=smoney] option:selected").index();//选中项的下标
            var val = data.value;
            if(options == 1){
                $('#emoney').hide();//面议隐藏后一项
            }else{
                //$('#emoney').show();
                var _val = parseInt(val);
                if(_val <= 50){    //50或以下
                    $("#emoney option").remove();
                    for(i=_val+1;i<=_val*2;i++){
                        $('#emoney').append("<option value='"+i+"'>"+i+"k</option>");
                    }
                }else{    //50以上
                    $("#emoney option").remove();
                    for(i=_val+10;i<= _val+50&&i<=260;i+=10){
                        $('#emoney').append("<option value='"+i+"'>"+i+"k</option>");
                    }
                }
            }
            form.render("select");
        })

猜你喜欢

转载自blog.csdn.net/xudejun/article/details/87125108
今日推荐