移动端实现左侧select值变化，右侧显示不同的标签

将pc端的写到移动端，项目中的移动端，写的是完全的原生js + jquery + html + amazeui，怎么在移动端实现pc端类似的效果，没有angular写着顺手。

1. 给左侧select添加change事件

2. 左侧select添加change事件,通过display控制显示隐藏

// select下拉框添加change事件，如果选中‘所属存储类型’，将content替换为下拉框，否则显示input框
$("#querySelected").change(function () {
    var paramKey = $("#querySelected  option:selected").text();
    if(paramKey == '所属存储类型'){
        $('#inputBox').css('display', 'none');
        $('#selectBox').css('display', 'block');
    }else{
        $('#inputBox').css('display', 'block');
        $('#selectBox').css('display', 'none');
    }
});

3. 这样存在一个问题，就是左侧的Key 与右侧的 Val 并不能完全的照应上

这时就需要做个判断，如果左侧key为存储类型，右侧Val就取右侧下拉框的value值，否则就取右侧input框的值。

4. amazeui中的 modal 模态框，类似与原生中的一个确认框（yes/no）

onConfirm：相当于 确认提交 要做的操作；
onCancel：相当于 取消提交 做的一些操作；

$('#searchModal').modal({
        relatedTarget: this,
        onConfirm: function(e) {

            var currentSelected = $('#querySelected').val();
            if(currentSelected == 'storageType'){
                var currentContent = $("#queryContent2").val();
                if(currentContent == 'ALL'){
                    currentContent = '';
                }
            }else{
                var currentContent = $("#queryContent").val();
            }


            if(selected == currentSelected && content == currentContent){
                return;
            }
            console.log('11111---->', currentSelected);
            console.log('222222---->', currentContent);

            selected = currentSelected;
            content = currentContent;
            recordCount = 0;
            $("#list").children('li').remove();
            $('.nodatadiv').css('display','none');
            sessionStorage.setItem('storage-selected', selected);
            sessionStorage.setItem('storage-content', content);
            loadStroageList();
        },
        onCancel: function(e) {
            $("#queryContent").val("");
            //===============清除的时候将存储类型的值 -之前选中的清除掉，然后将value为all的选中---未能实现
            console.log(e);
            $("#queryContent2 option[value=currentContent]").attr('selected','false');
            $("#queryContent2 option[value='ALL']").attr('selected','selected');
            if(content == ""){
                return;
            }
            selected = "";
            content = "";
            recordCount = 0;
            $("#list").children('li').remove();
            $('.nodatadiv').css('display','none');
            sessionStorage.setItem('storage-selected', selected);
            sessionStorage.setItem('storage-content', content);
            loadStroageList();
        }
    });