web-dev-qa-db-ja.com

HTMLでインラインJavaScriptを使用する方法は?

私がこの隠しフィールドを持っていることをサポートします:

_<input type='hidden' id='handler' name='handler' value='5534882394' />
_

そして、jQueryAJAXを介してサーバーからHTMLフラグメントをフェッチするとします。

_<div id='result'>
    <span></span>
</div>
_

ただし、次のように書く代わりに:

_$(function(){
   $('#result span').text($('#handler').val());
});
_

次のようなものを使用したいと思います。

_<div id='result'>
    <span>javascript:$('#handler').val();</span>
</div>
_

しかし、意図した結果が得られません。このアプローチをJavaScriptで使用できますか?

更新:みなさん、$(document).ready();について知っています。したがって、より良い方法を提供しないでください。インラインJavaScriptを使用できるかどうかを知りたかっただけです。そうであれば、どのようにしたらよいでしょうか。

8
Saeed Neamati

いいえ、Javascriptでそのアプローチを使用することはできません。インラインJavascriptのようなものはありません。

<a href="javascript:alert(1)">のようなリンクに表示されるのはjavascript:疑似プロトコル、使用法はhttp:プロトコル。ブラウザにそのようなURLを指定すると、ブラウザはスクリプトを実行します。

ページでスクリプトを実行する場合は、scriptタグが必要です。

14
Guffa

あなたができる-

<input type="text" id="handler" value="yes"/>
<div id='result'>
    <span>
       <script>document.write($('#handler').val());</script>
    </span>
</div>

そして、ページがscriptタグにヒットすると、ページはJavascriptを実行します。ただし、「#handler」要素がすでにロードされていることを確認する必要があります。そうしないと、スクリプトが失敗します。

一般に、このようなスクリプトタグはマークアップから遠ざける方がよいでしょう。

作業デモ- http://jsfiddle.net/ipr101/h6zXs/

6
ipr101

<script>タグは機能し、あなたがやろうとしていることを実行できるようになります。そこでデザインを再考することをお勧めします。これは、「控えめなJavascript」と直接呼ぶものではありません。

なぜHTMLとJSを組み合わせるのが好きなのですか?好奇心のためなら-OKですが、これが本番コードに変換することを目的としている場合は、2つをできるだけ分離することをお勧めします。最終的には、はるかに優れた保守性が得られます。

6
emboss

忘れましたか <script> tag

<div id="result"></div>
<script>$('#result').text($('#handler').val();</script>
3
Matt Ball

数年前、私はその正確な問題を抱えていました:私はAJAXを使用してHTMLを取得し、そのHTMLにはJavascriptが埋め込まれていました。HTMLを手動でDigに解析するよりも良い解決策を見つけることができませんでした。 Javascriptタグを取り出し、その内容でevalを呼び出します。ハックで信頼性がありませんが、私が見つけた中で最高でした。

2
Malvolio