ASP.NETマスターページでの要素強化JavaScript

StackOverflow https://stackoverflow.com/questions/176171

質問

ちょっとした問題にぶつかり、少し掘り下げましたが、決定的な答え/修正を見つけるのに苦労しています。

基本的に、ページ要素にいくつかの風変わりなことをして、見栄えを良くするjavascript（サードパーティが作成）があります。コードは単一ページ（つまりマスターなし）でうまく機能しますが、マスター内のコンテンツページにエフェクトを適用しようとすると、機能しません。

要するに、メインスクリプトリファレンスを含むマスターページがあります。すべてのページでスクリプトが使用されますが、渡されるパラメーターはコンテンツページによって異なります。

マスターページスクリプトリファレンス 

<script src="scripts.js" language="javascript" type="text/javascript" />

単一ページ 

<script>
    MakePretty("elementID");
</script>

ご覧のとおり、各ページの参照が必要です（そのため、マスターにあります）が、実際の要素は<！> quot; MakePretty <！> quot;です。コンテンツに応じて変化します。

コンテンツページ

現在、コンテンツページには<head>要素がないため、次のコードを使用してマスターページのalert("HI!")要素に追加しています：

HtmlGenericControl ctl = new HtmlGenericControl("script");
ctl.Attributes.Add("language", "javascript");
ctl.InnerHtml = @"MakePretty(""elementID"")";
Master.Page.Header.Controls.Add(ctl);

今、これは動作しません。ただし、Loadのような単純なものに置き換えると、すべて正常に機能します。そのため、コードは正常に追加されていますが、実行内容によっては常に実行されるとは限りません。

今、掘り下げて、コンテンツページのRegisterStartupScriptイベントがマスターページの前に発生することを学びました。これは効果があるかもしれませんが、ページのjavascriptはすべてロード/実行されたと思いました一回？

これが馬鹿げた質問なら許してください。しかし、特にマスターページのシナリオでは、私はまだJavaScriptを使用するのが比較的新しいです。

マスターページで参照されているjavascriptコードを呼び出すコンテンツページを取得するにはどうすればよいですか

この人たちのあらゆる/すべての助けに感謝します、あなたは本当にこの仕事の問題で私を助けてくれるでしょう。

注：

  • <=>などは、どのレベルでも機能しないようです。
  • MasterPage環境でもコントロールIDが適切に設定されており、期待どおりにレンダリングされています。

これらのいずれかが不明な場合は申し訳ありませんが、私は本当に疲れていますので、必要に応じて再記述/説明が必要な場合はコメントしてください。

役に立ちましたか？

解決

マスターページのヘッドセクションにContentPlaceHolderを配置し、プレースホルダーを参照するコンテンツページにasp：Contentコントロールを追加し、そのコントロールにスクリプトを配置します。この方法でページごとにカスタマイズできます。

また、マスターページを使用すると、ページ上のコントロールIDがコンテナー構造に基づいて自動的に作成されるため、IDによる参照が機能しない場合があります。 <！> quot; elementID <！> quot;の代わりに予想どおり、<！> quot; ctl00_MainContentPlaceHolder_elementID <！> quot;を出力している可能性があります。ソースを表示するか、firebugを使用してフォーム要素を検査し、出力されるIDを確認します。

他のヒント

クリーンなJavaScriptを使用することはできませんか？-）

-bodyタグ内に次のようなものを追加します。

<script type="text/javascript">
  window.onload = function(){
    MakePretty("elementID");
  }
</script>

ところで、script-tagには終了タグが必要です：

<script type="text/javascript" src="myScript.js"></script>

すべてのコントロールを見つけるためにjQueryを使用しないのはなぜですか？このようなもの：

$(document).ready(function(){
  $("input[type='text'], input[type='radio'], input[type='checkbox'], select, textarea").each(function(){
    MakePretty(this);
  });
});

このようにして、ページ上のすべての要素を取得し、ページの準備ができるまで待つことができます（したがって、DOMを不正に変更しないでください）。 jQueryセレクターは、必要に応じて、要素をもう少し特定の形式で取得できます（つまり、body divのIDなどのルート要素を追加します）。

MakePrettyメソッドを変更して、IDではなく要素をパラメーターとして使用し、処理のオーバーヘッドを削減することも最適です。

マスターページを使用すると、クライアント側のコントロールのIDは、あなたが思っているものとは異なります。スクリプトを生成するときは、Control.ClientIDを使用する必要があります。

マスターページを使用する場合、html属性IDに注意する必要があります。.NETはIDを一意に保つ必要があるため、この値を変更するためです。

私はあなたのjavascriptがIDを介してCSSスタイルを適用していると仮定します。マスターページを使用している場合、IDはaspxにあるものとは異なります。 JavaScriptが常に追加されていることを確認する場合、次の点を考慮する必要があります。

  • 常にページロードでマスターページIDを設定します（this.ID = <！> quot; myPrefix <！> quot ;;）
  • マスターページのHTML要素には、マスターページIDがプレフィックスとして付けられます（つまり、レンダリングされたページでは<！> quot; myPrefix_myDiv <！> quot;）
  • コンテンツプレースホルダーIDのHTML要素には、追加のプレフィックス（myPrefix_ContentPlaceHolderId1_myDiv）がプレフィックスとして追加されます

何か明確にできるかどうか教えてください。これがお役に立てば幸いです！

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top