javascript内のscript記載の動作について質問です。

PHP + Smarty + Mysql + Javascriptでサイトを作っています。


<div id="myText1">
</div>
<a href="javascript:void(0)" onClick="change('myText1','<script src="http://static.fc2.com/video/js/outerplayer.min.js" url="http://video.fc2.com/a/content/20140901yh9ye1xU/" tl="タイトル" sj="73000"></script>')">リンク</a>

上記のように下のリンクをクリックすると上の
<div id="myText1"> </div>
の中にリンクタグ内にあるscriptの部分を表示します。(FC2動画貼り付けタグ)
*head内のscript部分は省いています。
ただ上記のまま実行しようとしても動作しません。
scriptの部分を消してテキストのみにすると動作します。
おそらくエスケープ処理していないからではと思いいろいろやってはみましたがだめでした。

このクリックでscript内のscriptを動作させるののはどうすればよいのでしょうか?

回答の条件
  • 1人5回まで
  • 登録:2015/01/09 19:03:49
  • 終了:2015/01/16 19:05:05

回答(1件)

id:a-kuma3 No.1

a-kuma3回答回数4367ベストアンサー獲得回数18032015/01/09 19:27:24

ポイント300pt

change 関数の中身が分からないので、試してませんが、以下のように書き換えるとどうなりますか。

 onClick="change('myText1','<scr' + 'ipt src="http://static.fc2.com/video/js/outerplayer.min.js"
   url="http://video.fc2.com/a/content/20140901yh9ye1xU/"
   tl="タイトル" sj="73000"></scr' + 'ipt>')"

見切れちゃうので改行を入れてますが、一行にして大丈夫です。

 '<script>'  → '<scr' + 'ipt>'
 '</script>' → '</scr' + 'ipt>'

と、してるということです。


いや、違うな。
こうかな。

 onClick="change('myText1','<script src=\"http://static.fc2.com/video/js/outerplayer.min.js\"
   url=\"http://video.fc2.com/a/content/20140901yh9ye1xU/\"
   tl=\"タイトル\" sj=\"73000\"></script>')"

onclick の内側にあるダブルクォートを、バックスラッシュでエスケープ。
こっちのような気がします。
見切れてますけど、script の src 属性を閉じるダブルクォートもエスケープです。






追記です。

やっぱりこれで。

 onClick="change('myText1','<script src=\'http://static.fc2.com/video/js/outerplayer.min.js\'
   url=\'http://video.fc2.com/a/content/20140901yh9ye1xU/\'
   tl=\'タイトル\' sj=\'73000\'\></script>')">リンク</a>

script タグの中にある属性をくくってるダブルクォートを、シングルクォートに変えて、バックスラッシュでエスケープです。

ちなみに、change にタグを渡すと、テキストになって見えるんでしょうね?
change の実装は、こんなのを想定してます。innerHTML ではなく、textContent という。

<script>
function change(id, t) {
    var e = document.getElementById(id);
    e.textContent = t;
}
</script>
他1件のコメントを見る
id:numb08

追記です。
textContent ではそのままテキストが表示されるので動画は表示されませんでした。

2015/01/17 10:20:17
id:a-kuma3

html をそのまま表示するのではなく、スクリプトを動かしたいんですね。
関数 change を、以下のようにしてみてください。

<script>
function change(tID,str){
    document.getElementById(tID).innerHTML = str;
}
</script>

all は、古いIE でしか正しく動作しません。

2015/01/17 16:28:21

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません