城市的筛选 jq

     <div class="form-group">
                                            <label class="col-sm-2 control-label"><span class="red">*</span>所属省市：</label>
                                            <label style="margin-left: 19px;">
                                                <select class="form-control province" name="province">
                                                    <option value="">所属省</option>
                                                    {foreach name="province" item="v"}
                                                   <option value="{$v['cityid']}" {if condition="$v['cityid'] eq $list.sheng"}selected{/if}>{$v['city_name']} </option>
                                                    {/foreach}
                                                </select>
                                            </label>
                                             <label style="margin-bottom: 0px;width: 120px;">
                                                <select class="form-control city" name="city" data-bv-notempty="true" data-bv-notempty-message="不能为空">
                                                    {foreach name="city" item="v"}
                                                    <option value="{$v['cityid']}" {if  condition="$v['cityid'] eq $list.shi"}selected{/if}>{$v['city_name']} </option>
                                                    {/foreach}
                                                </select>
                                            </label>
                                            <label style="margin-bottom: 0px;width: 120px;">
                                                <select class="form-control area" name="area" data-bv-notempty="true" data-bv-notempty-message="不能为空">
                                                    {foreach name="area" item="v"}
                                                    <option value="{$v['cityid']}" {if  condition="$v['cityid'] eq $list.qu"}selected{/if}>{$v['city_name']} </option>
                                                    {/foreach}
                                                </select>
                                            </label>
                                        </div>

    // 省份选择
    $('body').on('change', '.province', function () {
        var province_id = $(this).val();
        if (province_id == 0) {
            $('.city').html(' ');
            $('.city').append("<option value=''>请选择</option>");
            $('.area').html(' ');
            $('.area').append("<option value=''>请选择</option>");
        } else {
            $.ajax({
                url: "{:url('Store/city')}",
                type: 'post',
                data: {province_id: province_id},
                success: function (data) {
                    $('.city').html(' ');
                    $('.city').append("<option value=''>请选择</option>");
                    $('.area').html(' ');
                    $('.area').append("<option value=''>请选择</option>");
                    $.each(data, function (key, value) {
                        $('.city').append("<option value='" + value.cityid + "' data-name='" + value.city_name + "'>" + value.city_name + "</option>");
                    });
                }
            })
        }
    })

    //城市选择
    $('body').on('change', '.city', function () {
        var province_id = $(this).val();
        if (province_id == 0) {
            $('.city').html(' ');
            $('.city').append("<option value='' class='hide'>请选择</option>");
            $('.area').html(' ');
            $('.area').append("<option value=''class='hide'>请选择</option>");
        } else {
            $.ajax({
                url: "{:url('Store/city')}",
                type: 'post',
                data: {province_id: province_id},
                success: function (data) {
                    $('.area').html(' ');
                    $('.area').append("<option value='' class='hide'>请选择</option>");
                    $.each(data, function (key, value) {
                        $('.area').append("<option value='" + value.cityid + "' data-name='" + value.city_name + "'>" + value.city_name + "</option>");
                    });
                }
            })
        }
    })