Question

我查看了与此问题相关的所有其他问题/解决方案，但无法找到解决方案。

我有一个带按钮的基本aspx页面。 OnClick调用JS函数。 Javascript函数调用document.getElementById（）。然后我调用一个存在于外部JA文件中的子函数，同一个调用失败。为什么呢？

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="jstest.aspx.cs" Inherits="jstest" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:CheckBox runat="server" ID="RunAtStartup" OnClick="function1();" text="Click Me" />
    </div>
    </form>

    <script>
    function function1()
    {
        if (document.getElementById("<%= RunAtStartup.ClientID %>") == null)
            alert('function1 null');
        else
            alert('function1 not null');
        function2();
    }
    </script>
    <script src="./function2.js"></script>
</body>
</html>

外部javascript文件function2.js是

    function function2() {
    if (document.getElementById("<%= RunAtStartup.ClientID %>") == null)
        alert('function2 null');
    else
        alert('function2 not null');
}

单击按钮的结果将显示function1为'not null'且function2为'null'。

我尝试将文档作为参数传递，但是没有用。我试着做一个function2（）。bind（document），但是没用。我逐步完成了javascript调试器，看起来function1中的文档对象与function2中的文档对象相同。

提前致谢迈克尔

Answer 1

从我所知道的，元素的名称是由ASP.net预处理器创建的。由于JS文件没有在ASP.net中解析，因此它按字面意思处理选择器，而不是真正的元素ID。因此，此脚本无法从外部JS文件运行。在ASP文件中，它取代

<%= RunAtStartup.ClientID %>

带有实际的元素ID。外部文件正在寻找这样的东西：

<span id="<%= RunAtStartup.ClientID %>"></span>

同样，它将ID视为文字字符串，就好像您在没有安装ASP.net的服务器上运行它一样。我的解决方案可能是将ID存储在ASP.net文件中的变量中，如下所示：

var id = "<%= RunAtStartup.ClientID %>";

然后，外部JS文件可以使用以下内容：

var element = document.getElementByID(id);

当然，在创建变量id之后，必须包含外部JS文件。或者，更好的解决方案是将ID作为函数参数传递，如下所示：

function function2(id) {
    if (document.getElementById(id) == null)
        alert('function2 null');
    else
        alert('function2 not null');
}

ASP.net文件可以像这样调用文件：

function2("<%= RunAtStartup.ClientID %>");

这允许所有ASP.net标记在使用JS代码传递到客户端之前在服务器端进行解析。

从外部JS文件调用时，document.getElementById（）返回NULL

1 个答案: