国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

Use p to simulate option

<script>
        var New_add_select = function(){};
        /**
         * 打印父類下拉框
         */
        New_add_select.prototype.repeat_first_category = function(argument){
            var first_category = '',
                len = argument.length;
            for(var i = 0;i<len;i++){
            first_category += "<option value = '"+argument[i].id+"'>"+argument[i].name+"</option>";
            }
            return first_category; 
        };
        /**
         * 打印子類下拉框
         */
        New_add_select.prototype.get_second_category = function(id,argument){
            var len = argument.length,
                arr = [];
            for(var i = 0;i<len;i++){
            if(Number(id) === Number(argument[i].portType)){
                arr.push(argument[i]);
            }
            }
            return arr; 
        };
        New_add_select.prototype.repeat_second_category = function(argument){
            var second_category = '',
                len = argument.length;
            if(len>0){
            $('.second_select').css('display', 'block');
            }else {
            $('.second_select').css('display', 'none');
            }
            for(var i = 0;i<len;i++){
                second_category += "<option value = '"+argument[i].label+"'>"+argument[i].name+"</option>";
            }
            return second_category;
        };

        var new_add_methods = new New_add_select();

         /**
         * 獲取分類方法
         */
        function get_category(){
            $.ajax({
            url: '/api/categories',//示例后端數(shù)據(jù)接口
            type: 'POST',
            })
            .done(function(data) {
                $('#first_select').html(new_add_methods.repeat_first_category(data.port_type));//打印一級菜單的數(shù)據(jù)
                /**
                 * 父類change方法
                 */
                $('#first_select').on('change',function(){
                    var select_id = $('#first_select option:selected').val();//獲取選中的值的id
                    $('#second_select').html(new_add_methods.repeat_second_category(new_add_methods.get_second_category(select_id,data.categories)));//根據(jù)選中的值的id 獲取二級菜單的數(shù)據(jù)
                });
            })
            .fail(function(data) {
                console.log(data);
            });
        }
        /**
         * 初始化方法
         */
        get_category();

Post the code. I can’t find the specific data structure here. Anyway, it’s just to get the data through ajax with more IDs. It’s very simple

The idea is not difficult. The most important thing is to monitor changes in the first-level list (here you can monitor the click event of the list), and then dynamically change the content of the second-level list (if it is not complicated, just use string splicing, otherwise use a template engine). As for the content data, all the data can be obtained in advance or on demand.

This should have a reasonable json format, such as the following. It can also be nested. Anyway, there will be a parsing rule, and then your data will be rendered. It is no different from rendering a table. If compatibility is not considered, you can use the attribute selector to complete it, which is super fast.

{
    1：中國
    10：河北,
    10+：的全都是河北里面的
    20：北京
    30：上海
}

Generating data for the first-level province:
js gets the value of the user clicking on the first-level province (#province):

 $("#province").change(function(){
    var proVal=$("#select_id").val();
    $.post(uri,{'province':proVal},function(res){ 
        //后端返回對應(yīng)省份的二級數(shù)據(jù)，將數(shù)據(jù)動態(tài)加載到select
    })
});

It’s roughly like this. There’s a big-breasted brother who wrote it very clearly above.