javascript - 为什么我的代码在 external.js 文件中无法运行，但在 HTML 中却可以运行

Question

我正在尝试获取 Javascript/jQuery从外部运行的代码片段.js文件。

在我的 asp.net html 页面底部的脚本标记内运行良好，但现在它在外部 JS 中文件它不运行。我已成功插入(动态)外部文件的链接(可在页面源代码中查看)，并且能够从其中触发弹出警报，因此我知道外部文件正在被正确访问。我还引用了JQuery在外部文件之前，但以下脚本不会触发/运行？任何想法都会很棒，谢谢。

$("#<%=sDatepicker.ClientID%>").focus(function () {
  //$(this).blur();
  alert("Handler for .Datepicker called.");
});

如您所见，我正在尝试访问 Textbox与 ID=sDatepicker ，但 asp.net 添加了 ClientID在它之前，所以我需要找到实际的 TextBox .

我认为该页面可能尚未加载，并且 TextBox控制可能不作为外部存在 JS文件位于 Head我的文档，但我也尝试添加

$('document').ready(function () { });

围绕JS文件中的脚本，但这似乎没有帮助。

就像我说的，在 HTML 时效果很好。页面，但我只需要在某些情况下引用外部文件，因此需要在需要时从我的 C# 代码后面动态添加它。

干杯。

更新以下有关可能的解决方案 1 的反馈。

我的外部现在有 JS文件如下:

$(document).ready(function () { keypadSuppress(); });

在我的 .aspx 中HTML文件我有以下内容:

<script type="text/javascript">
    function keypadSuppress() {
            $("#<%=sDatepicker.ClientID%>").focus(function () {
                $(this).blur();
                alert("Handler for sDatepicker called.");
            });

            $("#<%=eDatepicker.ClientID%>").focus(function () {
                $(this).blur();
                alert("Handler for eDatepicker called.");
            });
    }
</script>

更新2

在上面的更新中尝试了上面的代码，今天它工作正常(小妖怪一定还在 sleep )。我所做的唯一更改是向 Document.ready 添加警报函数在访问时进行标记，但这不是问题。上面的代码可以正常工作。

我唯一需要做的就是添加 <div>围绕它，我在 C# 代码中使用

bool IsMobile = Page.Request.Browser.IsMobileDevice;

谢谢，我们终于到了:)

Answer 1

当 JavaScript 内嵌在 HTML 中时，ASP.NET 可以正确解析 <%=%> 标记。当您将此 javascript 逐字提取到外部文件中时，ASP.NET 解析器将不会处理此文件，因此 id 标记将不会转换为正确的 id，正如 Rory McCrossan 已经指出的那样。

现在，一些可能的解决方案:

• 您可以在外部 javascript 文件中定义一个函数，并在网页上的某些内联 javascript 中调用该函数。此内联 JavaScript 可以使用 <%=%> 标记，它们将正确地替换为日期选择器元素的 ID。
• 您可以选择服务器生成的 ID 以外的其他内容来正确识别您的日期选择器。考虑添加自定义 CSS 类，或自行选择 ID。