2017-02-04 24 views
0

この問題に関連する他のすべての質問/解決策を見てきましたが、解決策を見つけることができませんでした。document.getElementById()は、外部JSファイルから呼び出されたときにNULLを返します

ボタン付きの基本的な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が 'nullでない' で表示され、関数2は、 'NULL' です。

私はパラメータとしてドキュメントを渡そうとしましたが、うまくいきませんでした。私はfunction2()。bind(document)をやろうとしましたが、うまくいきませんでした。私は、javascriptデバッガを踏んで、function1のドキュメントオブジェクトがfunction2のドキュメントオブジェクトと同じであるように見えます。私が言うことができるものから、事前 で

おかげでマイケル

+0

は、jsファイルの名前です。function2.js ?? –

+0

以下の答えを見てください。 '.js'ファイルにサーバサイドコード' <%= ...%> 'を混在させています。 – EdSF

答えて

3

要素の名前は、ASP.netプリプロセッサによって作成されます。 JSファイルはASP.netで解析されないため、実際の要素IDではなく文字通りセレクタが処理されます。したがって、このスクリプトは外部JSファイルからは実行できません。 ASPファイルでは、実際の要素IDで、

<%= RunAtStartup.ClientID %> 

と置き換えられます。外部ファイルには、このような何かを探している:あなたはASP.netせずにサーバー上でそれを実行した場合インストールされ

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

は再び、それは、文字列リテラルとしてIDを扱います。私のソリューションは、おそらくこのように、ASP.netファイル内の変数にIDを保存するために、次のようになります。

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

その後、外部JSファイルには、次を使用することができます。

var element = document.getElementByID(id); 

外部JSもちろん、変数idが作成された後にファイルをインクルードする必要があります。これが可能に

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

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

ASP.netファイルは、このようなファイルを呼び出すことができます。また、より良い解決策は、このように、関数のパラメータとしてIDを渡すことであろうすべてのASP.netタグは、JSコードでクライアントに配信される前に、サーバー側で解析されます。

+0

おかげさま...それは完璧な意味合いがあります。 ASPは.jsファイルを解析して処理しません。答えをありがとう! – WebDrive

+0

@WebDriveもちろん、問題ありません。常に喜んで助けてください! –

関連する問題