6

PHPスクリプトに投稿するフォームが投稿されたときに、target属性を使用してiframeをターゲットにするフォームがあります。この部分は正常に機能していますが、phpスクリプトがiframeに配置するいくつかの結果に基づいて何かを行う必要があります。

私が考えているのは、PHPスクリプトの投稿が終了すると、投稿の状態、成功したかどうか、投稿に成功した場合の最終結果など、さまざまな要素を含むいくつかの非表示の入力フィールドがエコーアウトされることです。

ただし、これを行うとiframeに配置されるため、メインのWebページは非表示の入力フィールドにアクセスできなくなります。

メインWebページがこれらの非表示の入力フィールドにアクセスして、メインWebページが何らかのアクションを実行できるようにするには、どのようにすればよいでしょうか。つまり、Webページ内のdivに特定のエラーメッセージなどを表示させることができます。

もう1つは、非表示の入力フィールドからデータを取得する方法がわかれば、いつ行って値を取得できるかをどのように知ることができるかということです。フォームがJavaScriptdocument.forms["myform"].submit()コードを介して投稿されると、whileループを実行して、別の非表示の入力フィールドステータスが完了に設定されているかどうかを確認し、完了と表示されたら、非表示の入力フィールドから値を取得できると考えていました。 。

私が提案した方法が正しい方法であるか、私が達成したいことを実行するかどうか、またはそれを実行するためのより良い方法があるかどうかはわかりません。

アップデート

@lanzzが提案したことを試しましたが、うまくいかなかったようです。以下は私が試したことです。

$("iframe#image_upload_frame").on('load', function()
{
   var iframeBody = this.contentDocument.body;


   var data = $(iframeBody).find("#imageDirectory");
   alert("data: " + data);
});

以下はiframeの定義方法です

<iframe id="image_upload_frame" name="image_upload_frame"></iframe>

そして、iframe内にあるphpスクリプトの非表示の入力フィールドをエコーアウトしています。

echo '<input type="hidden" id="imageDirectory" value="'.$imageDirectory.'" />';

エコーは明確に機能しています。iframeソースを表示すると、非表示の入力が表示されますが、アラートダイアログが機能していないように表示されることはありません。グーグルクローム開発コンソールによっても報告されているエラーはありません。

4

5 に答える 5

5

私が正しく理解していれば、値がiframeに読み込まれたら、親ウィンドウのiframeから値が必要になります。親を呼び出して関数を実行するiframeにJavaScriptを追加します。

メインフレーム内：

function incomingValue(val) {
   alert(val)
}

生成されたiframeのどこか：

<script type="text/javascript">
 parent.incomingValue("Hello world");
</script>

これは、両方のフレームソースが同じドメインを共有していると仮定して機能するはずです。

于 2012-10-31T13:59:21.603 に答える
1

postMessageを使用して、iframeとその親の間のクロスドキュメント通信を行うことができます。

見る：

http://viget.com/extend/using-javascript-postmessage-to-talk-to-iframes

http://javascript.info/tutorial/cross-window-messaging-with-postmessage

于 2012-10-28T00:28:52.743 に答える
1

同じドメインで実行しているため、メインページのJavascriptは問題なくコンテンツにアクセスできます<iframe>（例ではjQueryを使用しているため、使用する予定のライブラリに書き換えることができます）。

$('iframe#the-id-of-the-iframe').on('load', function() {
    var iframeWin = this.contentWindow;
    var iframeBody = this.contentDocument.body;

    // access global JS vars defined in the iframe:
    var someIframeVariable = iframeWin.globalIframeVariable;

    // or, directly access elements in the iframe:
    var someIframeElement = $(iframeBody).find('#element-id-inside-iframe');
});
于 2012-10-28T17:10:01.983 に答える
0

少し前に、JavaScriptと2つのiframeを使用して画像をアップロードするコードを作成しました。私にとって最も重要なことは、写真をプレビューすることでした。多分それはあなたを助けるでしょう：

HTML：

<div id='fakebutton' onclick='select_pic()'>Just a button to select a pic</div>
<iframe src='uploadform.php' name'pic_frame'></iframe>
<iframe src='#' name='target_frame'></iframe>

両方のiframeが非表示になっています。ターゲットフレームにはソースがありません（または、必要に応じて空のページがあります）。

uploadform.phpには次のフォームが含まれています。

<form id='upload_form' action='dosomething.php' method='post' enctype='multipart/form-data' target='target_frame' onsubmit=''>
<input id='realfoto' name='realfoto' type='file' onchange='parent.foto_upload(window.frameElement.id)'>
</form>

次に、JavaScript：まず、ユーザーが偽物をクリックしたときにファイルブラウザをトリガーするもの

function select_pic(){
   b=window.frames['pic_frame'];
   b.document.upload_form.realfoto.click();
   }

次に、入力要素のonchange（）によってトリガーされた、実際に写真をアップロードする部分：

function foto_upload(o){
  var b=o;
  o=getElementById(o);
  if(o.contentDocument ) {o = o.contentDocument;}
  else if(o.contentWindow ){o = o.contentWindow;}
  else{return false;}
  if(test_pic(o,b)){ //test if it is really a pic
     getObj('foto_tmpdir').value=o.getElementById('tmp_dir').value;
     o.getElementById('doctype_nr').value=b;
     o.fotoform.submit();
     }
  else{
return false;}
}

dosomething.phpで、アップロードされた写真に対してアクションを実行します（名前の変更、サイズ変更など）。そしてそれはjavascriptの数行を含んでいます：

$a = 'upload was succes';
$b = 'my_image_name';
$c = 'whatever you want to put here';  
?>
  <script type="text/javascript">
  window.top.window.smurf(<?php echo "'$a','$b','$c'" ?>);</script>
  <?php

javascriptyでsmurf（a、b、c）という名前の関数を作成すると、php-scriptから好きなものを渡すことができます。私にとって最も重要なことの1つは、アップロードされた写真のファイル名をjavascriptに渡し、それを使用してプレビュー用にimage.srcを変更できることです。あなたがそれの何かを使うことができることを望みます。

于 2012-11-02T14:16:29.007 に答える
0

iframeソースページには、非表示フィールドの代わりにjavascript呼び出し関数が必要です。この関数はオープナーウィンドウ（メインページ）を呼び出し、必要な機能を実行します。ブループリントとして、以下を見てください。

//in iframe src.php

<?php
if ($something){
?>
<script>
function doSomethingWithOpenerWindow(){
opener.document.write('hi);
}
doSomethingWithOpenerWindow()
</script>
<?php
}
else{
?>
<script>
function doAnotherSomethingWithOpenerWindow(){
opener.document.write('hi);
}
doAnotherSomethingWithOpenerWindow()
</script>  

<?php
}
?>
于 2012-11-02T15:52:56.757 に答える