ASP.NET MVC加载Partial View后Select2报is not a function错误求解决

这个错误核心原因是Partial View加载时重复引入了jQuery，导致原jQuery实例被覆盖，Select2插件绑定的旧实例失效，新实例没有select2方法。按以下步骤修复：

1. 移除Partial View中的重复jQuery引用
   打开_TaskAssignedHistory.cshtml，检查是否存在jquery-3.6.1.min.js的引用，如有直接删除。主视图已加载jQuery，Partial View会共享该环境，无需重复引入。

2. Partial View加载完成后重新初始化Select2
   修改UpdateTaskAssigned函数（负责保存并加载Partial View的函数），在Partial View渲染完成后，重新初始化主视图的Select2下拉框：

   function UpdateTaskAssigned() {
       // 执行保存逻辑的AJAX请求
       $.ajax({
           url: '../YourSaveAction', // 替换为实际的保存接口地址
           type: 'POST',
           data: $("#frmStaffAssign").serialize(),
           success: function(result) {
               // 加载Partial View到容器
               $('#PartialViewAssignedH').html(result);
               // 重新初始化Select2下拉框
               $("#BranchAssign").select2({ width: '100%' });
               $("#ddlEmpIdAssign").select2({ width: '100%' });
           },
           error: function(err) {
               console.error('保存失败:', err);
           }
       });
   }
   

3. 修正脚本细节（优化）

   • 把trigger("changed")改为trigger("change")，Select2的正确事件名是change
   • 移除async: false，避免阻塞主线程，调整后的GetBranchMembers函数：

     function GetBranchMembers(xVal) {
         $("#ddlEmpIdAssign").empty().trigger("change");
         $.ajax({
             url: '../GetBranchMembers',
             type: 'POST',
             dataType: 'json',
             cache: false,
             data: { Id: xVal },
             success: function (data) {
                 if (data.Success) {
                     $("#ddlEmpIdAssign").select2({
                         width: '100%',
                         data: JSON.parse(data.items)
                     });
                 }
             },
             error: function(err) {
                 console.log(err.message);
             }
         });
     }
     

4. 确认主视图脚本加载顺序
   确保主视图中脚本加载顺序为：jQuery → Select2，当前你的引用顺序是正确的，无需调整，但要排查布局页或其他子视图是否有重复加载jQuery的情况。

内容的提问来源于stack exchange，提问作者Dev Beginner