jQuery Force setsrc属性をiframeに

83

メインページ（実際にはJSP）の中にiframeがあります。

<iframe name="abc_frame" id="abc_frame" src="about:blank" frameborder="0" scrolling="no"></iframe>

これで、メインページに複数のリンク（JSPを介して動的にレンダリングされる）があり、srcを何らかのURLに設定しようとすることができます...

今私の質問は、jQuery（live（）かもしれません）を使用して、abc_frameの「src」属性が常に特定の値（たとえば「somefixedURL」）を持つようにオーバーライドできますか？

リンクのクリックをキャプチャできません。これは、一部のJavaコードを介して完全に動的に作成されているため、iframe srcをオーバーライドしようとしていますか？

javascript jquery dom

— testndtv
ソース

166

attrを使用する

$('#abc_frame').attr('src', url)

このようにして、すべてのHTMLタグ属性を取得および設定できます。もあることに注意してください.prop()。違いについては、.prop（）と.attr（）を参照してください。短いバージョン：.attr()HTMLソースコードで記述されている属性に使用され.prop()、DOM要素にアタッチされているすべてのJavaScriptに使用されます。

— PiTheNumber
ソース

ページが...別のリンクは、新しい値にSRCを変更します、ロードされた後に、これは仕事がありませんでした理由

— testndtv

ファイルの最後にコードを追加すると、他のスクリプトの後にコードが実行されます。ユーザーがクリックした特定のリンクによって問題が発生した場合は、2番目のonclickイベントをリンクに追加できます。それ以外の場合は、setTimout / setIntervalを使用して、srcの値を繰り返しチェックする必要があります（醜い！）。

— PiTheNumber 2011

20

jQuery 1.6以降を使用している場合は、ではなく.prop（）を使用する必要があります.attr():

$('#abc_frame').prop('src', url)

違いの説明については、この質問を参照してください。

— kalyfe
ソース

4

興味深いリンクですが、jQueryが attr()動作を元に戻したため、回答が更新されていることに注意してください。リンクしたAPIドキュメントで説明されているように、これはプロパティではなく属性.prop()であるため、全体的にここでの使用には同意しsrcません.prop()。

— PiTheNumber 2013

9

リンクを生成している間、ターゲットをiframes nameプロパティに設定すると、おそらくjqueryをまったく処理する必要がなくなります。

<a href="inventory.aspx" target="contentframe"  title="Title Inventory">
<iframe id="iframe1" name="contentframe"  ></iframe>

— ブライアン・リゾ
ソース

可能であればブラウザのネイティブメソッドを使用することをお勧めしますが、ユーザーは動的リンクを持っていると思うので、クリック属性をキャプチャする必要があります。

— efwjames 2014

どのくらいダイナミックですか？ページを生成するときは、hrefを必要なものに設定するだけです。または、DOMロードでも、必要に応じてhref属性を設定するだけです。重要なのは、iframeのsrcプロパティを処理する必要がないことです。これにより、それが可能になります。

— ブライアンリゾ2014

8

$(document).ready(function() {
    $('#abc_frame').attr('src',url);
})

— ジャエンドラ
ソース

5

src属性の設定がうまくいきませんでした。iframeはURLを表示しませんでした。

私のために働いたのは：

window.open(url, "nameof_iframe");

それが誰かを助けることを願っています。

— ハリ
ソース

.attr（）での設定も私にはうまくいきませんでした。これは機能します

— Andy N

3

<script type="text/javascript">
  document.write(
    "<iframe id='myframe' src='http://www.example.com/" + 
    window.location.search + "' height='100' width='100%' >"
  ) 
</script>

このコードは、iframeを含むページからurl-parameters（？a = 1＆b = 2）を取得し、それらをiframeのベースURLに添付します。それは私の目的のために働きます。

— アレンド
ソース

document.write使用eval()するのと同じです-スクリプトインジェクションの対象です！細心の注意を払ってのみ使用してください！

— amphetamachine

1

FIX iframeのsrcを設定したり、javascript / formsubmitでその場所を変更したりすることはできません。ただし、スクリプトをページのオンロードに配置し、各動的リンクのアクションを変更することができます。

— Jan Pfeifer
ソース

1

$(".excel").click(function () {
    var t = $(this).closest(".tblGrid").attr("id");
    window.frames["Iframe" + t].document.location.href = pagename + "?tbl=" + t;
});

これは私が使用するものであり、これにjqueryは必要ありません。この特定のシナリオでは、Excelエクスポートアイコンが付いたテーブルごとに、そのテーブルにアタッチされたiframeに、ページが検索するクエリ文字列内の変数を使用して同じページを強制的にロードし、見つかった場合、応答はmimetypeに優れており、そのテーブルのデータが含まれています。

— vernmic
ソース