1

我正在创建一个使用 jQuery.UI 自动完成功能的自定义控件。我的应用程序有一个标准的 Webform Masterpage，其中包含一个 ScriptManager 标记。

我正在嵌入一个包含以下代码的 javascript 文件。

$(document).ready(function () {  
    var param;
    var p = '<%=this.PostbackURL%>';


    $('#<%=AutoCompleteTextBox.ClientID%>').autocomplete({
        source: function (request, response) {
            param = $('#<%=AutoCompleteTextBox.ClientID%>').val();
            console.log('Param: ' + param);
            $.ajax({
                type: "POST",
                url: p,
                data: '{term:"' + param + '"}',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                dataFilter: function (data) { return data; },
                success: function (data) {
                    response($.map(data.d, function (item) {
                        return {
                            value: item
                        }
                    }))
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(textStatus);
                }
            });
        },
        close: function (event, ui) {
            c();
        },
        minLength: 1
    })
        .autocomplete("instance")._renderItem = function (ul, item) {
            return $("<li>")
                .append(formatListItem(param, item.value))
                .appendTo(ul);
        };

});

在类本身中，我尝试了各种尝试，因为注册 js 文件试图在 MasterPage 中的 ScriptManager加载后加载 Jquery 代码，但没有成功。

 protected override void OnLoad(EventArgs e)
        {
            base.OnLoad(e);

 Page.ClientScript.RegisterClientScriptResource(typeof(AutoCompleteTextboxServerControl), "AutoCompleteTextbox.Scripts.Custom.js");
        }

因此，在测试页面的页面源中，Webresource.axd 在加载 Jquery 之前加载。

// WebResource contains the autocomplete js code ->
<script src="/WebResource.axd?d=zNH31OAcb5wrxPoggl5f_MlEhQbiGePLqOV1mx07OO6SSXqoLMXL1kQJWOtZYT8yi9_NYq5dkaLcyDlu5yOmTmJjGDY0XZ5-soxCdlMvlykrdyRRlogmLUOD8kflF3WtmwbAZvh6nWg3uAAwcpe0JQ2&amp;t=637070115488096556" type="text/javascript"></script>

<script src="/bundles/MsAjaxJs?v=D6VN0fHlwFSIWjbVzi6mZyE9Ls-4LNrSSYVGRU46XF81" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(Sys) === 'undefined') throw new Error('ASP.NET Ajax client-side framework failed to load.');
//]]>
</script>

// jQuery 3.3.1 loads here ->
<script src="Scripts/jquery-3.3.1.js" type="text/javascript"></script>

<script src="Scripts/bootstrap.js" type="text/javascript"></script>
<script src="/bundles/WebFormsJs?v=N8tymL9KraMLGAMFuPycfH3pXe6uUlRXdhtYv8A_jUU1" type="text/javascript"></script>
<div class="aspNetHidden">

    <input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="CA0B0334" />
</div>
        <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ctl08', 'ctl01', [], [], [], 90, 'ctl00');
//]]>
</script>

可以更改顺序吗？

4

1 回答 1

0

所以我想出了加载顺序问题。这很容易。您需要在 MasterPage 中引用 ScriptManager，然后添加 ScriptReference。

protected override void OnInit(EventArgs e)
{
      var mgr = System.Web.UI.ScriptManager.GetCurrent(this.Page);
      mgr.Scripts.Add(new ScriptReference { Path = "Scripts/Custom.js" });
}
于 2019-10-25T19:57:52.657 回答