Question

似乎在通过ColorBox（不使用iframe）加载Razor局部视图时，JavaScript库没有正确初始化，或者它是部分的artifacte。如果我在父页面中包含库，则JavaScript函数在部分jsut内部运行。当库处于部分状态时，我没有看到来自浏览器的任何错误，但它无法正常工作。如果我将库（在这种情况下为fileuploader.js）移动到partial之外并将该函数保留在partial中它可以正常工作。

示例：

<script src="@Url.ContentArea("~/Scripts/plugins/ajaxUpload/fileuploader.js")" type="text/javascript"></script>

                   <div id="file-uploader">
                        <noscript>
                            <p>
                                Please enable JavaScript to use file uploader.</p>
                        </noscript>
                    </div>


<script>

 $(function () {
        var fileCount = 0;
        var uploader = new qq.FileUploader({
            element: document.getElementById('file-uploader'),
            action: '/Admin/Avatar/AvatarUpload',
            debug: true,
            params: {
                'userId': '@ViewBag.UserId'
            },
            onSubmit: function (id, fileName) {
                fileCount++;
            },
            onComplete: function (id, fileName, responseJson) {
                if (responseJson.success) {
                    if (createAvatar(responseJson.file, responseJson.imageId)) {
                        fileCount--;

                    } else {
                        fileCount--;

                    }
                } else {
                    $("span.qq-upload-file:contains(" + fileName + ")").text(responseJson.errorMessage);
                    fileCount--;
                }

                if (fileCount == 0) {
                 .....
                }

            },
            onCancel: function (id, fileName) {
                fileCount--;
                if (fileCount == 0) {
                    ....
                }
            }
        });
    });

<script>

Answer 1

您可能想要检查是否存在对您正在使用的JavaScript库的重复引用（一个在父级中，一个在部分中）。

这是一个常见问题，它不会引发任何错误，但会阻止您的JavaScript代码执行。

Answer 2

我认为这是一个时间线问题。在“部分视图”加载（或附加div）之前，JavaScript尝试绑定它并失败。因此，它无法找到Partial View文档中的元素。我有一个像“ColorBox”这样的问题。我找到了解决这个问题的方法。例如：当你调用GET或POST方法时，查询后放一个像这样的控制点。例如绑定“colorbox”：

function getMyPartial(partialname) {
    var resultDiv = document.getElementById("content");
    $.ajax({
        type: "GET",
        url: partialname,                                                                                 
        async: false,
        success: function (data) {
            resultDiv.innerHTML = "";
            resultDiv.innerHTML = data.toString();
        }
    });    
    var indd = 0; //This is Control Point
    if (partialname == "YourPartialName") {
        var yourelementinpartial= document.getElementById("example");
        while (!yourelementinpartial) {
            indd++;
        }  
        $(".group4").colorbox({ rel: 'group4' }); //binding point
    }      
}

在控制点，如果PartialView文档中的任何元素发现它将绑定。

通过ColorBox调用partial时加载JavaScript？

2 个答案: