ajax 動態載入html後不能執行其中的js解決方法(後續更新 使用Razor可以執行)

前端

這邊的寫法跟參考的有所差距

原因是帶資料進去不知道為何帶回去之後alert出來的並不是js代碼 而是String

因此我就直接讓他alter出來即可

@* 這邊是在處理上傳資料 *@

<input type="file" id="fileupload" name="fileupload" accept=".xlsx" multiple="multiple" />

<input type="submit" id="fileSubmit" name="fileSubmit" class="btn btn-primary" value="寫入資料庫" />

@if (ViewBag.msg != null)

{

<alert>

    @ViewBag.msg

</alert>

}

<script>

    $("#fileSubmit").on("click", function () {

        var file = $("#fileupload").val;

        if (file == null || file == "") {

            alert("無上傳檔案");

        } else {

            var file = document.getElementById("fileupload").files;

            var fileData = new FormData();

            for (var i = 0; i < file.length; i++) {

                fileData.append("files", file[i]);

            }

            $.ajax({

                url: '@Url.Action("Query", "CmPreMemberImport")',

                contentType: false,

                async: true,

                type:"POST",

                cache: false,

                processData: false,

                data: fileData,

                error: function (jq, status, error) {

                    alert("File:" + error);

                },

                success: function (data, status, jq) {

                    // 第一步：匹配加載的頁面中是否含有目標字串

                    var regDetectJs = /<alert>(.|\n|\r\n)*?<\/alert>/ig;

                    var jsContained = data.match(regDetectJs); //ajaxLoadedData為ajax獲取到的數據

                    // 第二步：如果包含目標字串，則一段一段的取出再加載執行

                    if (jsContained) {

                        // 分段取出目標字串正則

                        var regGetJS = /<alert>((.|\n|\r\n)*)?<\/alert>/im;

                        // 按順序分段執行

                        var jsNums = jsContained.length;

                        //走訪捕捉到的Data

                        for (var i = 0; i < jsNums; i++) {

                            var jsSection = jsContained[i].match(regGetJS);

                            if (jsSection) {

                                //切出字串後alert出去

                                alert(jsSection[1]);

                            }

                        }

                    }

                },  

            })

        }

    })

</script>

前端改成

@using (Html.BeginForm("Query", "Controller", FormMethod.Post, new { enctype = "multipart/form-data" }))

{

    <input type="file" id="fileupload" name="fileupload" accept=".xlsx" multiple="multiple" />

    <br />

    <input type="submit" id="fileSubmit" name="fileSubmittest" class="btn btn-primary" value="寫入資料庫" />

}

後端不變

public ActionResult Query(HttpPostedFileBase[] files )

        {

            //取得路徑

            string path = HttpContext.Server.MapPath("../Temp/");

            

            //判斷是否存在資料夾，不存在則建立

            if (!System.IO.Directory.Exists(path))

            {

                System.IO.Directory.CreateDirectory(path);

            }

            //走訪回傳資料

            try

            {

                foreach (HttpPostedFileBase file in files)

                {

                    //獲取Path，取IIS根目錄，並串起新newPath

                    string newPath = path + file.FileName;

                    //儲存進某個地方以方便讀取

                    file.SaveAs(newPath);

                    //todo

                }

            }

            return View("Query");

        }

 參考:https://www.itread01.com/content/1529481847.html