jquery插件select2的所有事件，包括清除，删除，打开等

最新推荐文章于 2022-08-31 18:32:49 发布

木辰風

最新推荐文章于 2022-08-31 18:32:49 发布

阅读量995

点赞数

分类专栏：插件学习

原文链接：https://blog.csdn.net/jiangeeq/article/details/52457351

版权

插件学习专栏收录该内容

12 篇文章 1 订阅

订阅专栏

Vue集成select2插件，在选择时进行逻辑判断，确认则进行下一步，否则下拉框的值不变。

/**
 * 承办方式
 */
function initContractingModeSelect() {
    $('.contractingModeSelect').selectBindEx({
        data : window['MORE/90000003/chr'],
        placeholder : '请选择承办方式',
        allowClear: false,
        selected: vm.purchaseProject.contractingMode,
        change: function(val){
            vm.purchaseProject.contractingMode = val;
        }
    });

    $('.contractingModeSelect').on("select2:selecting", function(e) { // select2选择中事件
        var val = $('.contractingModeSelect').val(); //原本的值
        var materialData = $('#materialGrid').bootstrapTable('getData');
        if (materialData && materialData.length > 0) {
            dialogConfirm("承办方式发生变更，已经存在的物资信息将会删除!", function(){
                var ids = [];
                $.each(materialData, function(idx, item) {
                    ids[idx] = item.id;
                    vm.purchaseProject.deleteMaterialIds.push(item.id);
                });
                
                $('#materialGrid').bootstrapTable('remove', {
                    field : 'id',
                    values : ids
                });
                dialogMsg('删除成功！', 'success');
            }, function(){
                //取消，回调
                $('.contractingModeSelect').val(val);
                $('.contractingModeSelect').trigger('change'); //动态改变值以后必须触发改变时间。否则将不会生效
            });
        }
    }); 

}

原文链接：https://blog.csdn.net/jiangeeq/article/details/52457351