2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Literalでjavascriptを呼び出すときの注意

Last updated at Posted at 2018-07-11

##書きたいこと

  • Literalを使用したときの注意点を記載。

##経緯

  1. webapp作成中ボタンのイベントハンドラー処理でポップアップを表示するためLiteralを使いjavascriptを使用した。
  2. ボタンボタンイベント発生時HTMLで作成した画面が途中から描写されていない状態でjavascriptが発生していた。

##原因

  • Literalを使用してjavascriptを呼び出したとき画面表示がHTMLの上から順番に表示して行ってLiteralの箇所でjavascriptが発生してそれ以降表示しなかったため。
  • まとめると、画面描写がおかしいのではなく、画面描写の途中でjavascriptが、走っている状態。

##対応
・onLoadイベントで実行するようにする。
<ラムダ式有り(IE11非対応)>

   protected void Button_Click(object sender, EventArgs e)
   {
       string msg = "ボタン";
       Literal.Text =
            "<script type=\"text/javascript\" >"
           +"window.addEventListener('load', () => confirm('" + msg + "'));"
           +"</script>";
   }

<ラムダ式無し(IE11も対応)>

```html
   protected void Button_Click(object sender, EventArgs e)
   {
       string msg = "ボタン";
       Literal.Text =
            "<script type=\"text/javascript\" >"
           +"window.addEventListener('load', function () {"
           +"return confirm('" + msg + "');});"
           +"</script>";
   }

今後清書予定あり

処理を教えてくださったalbireoさんに多大なる謝辞を

2
1
6

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?