私は隠されたIframeを表示する必要があります

Question

私のページは私のフォームを送信した後に表示する必要がある隠しiframeで始まります。それはかなり簡単ですが、なぜそれが動作していないのか全く分かりません。あなたが手伝ってくれれば幸いです。ここ はiframeのコードです：

 <iframe src="" name= "UpdIframe" id= "UpdIframe" style="display:none"> </iframe> 

そして、ここでは、私はそれを隠し、表示するために使用していJS関数です。

<script> 
function submitFrame(){ 
document.getElementById('UpdIframe').style.display = "block"; 
} 
</script> 

この機能は実際にはもっと多くのことを行いますが、質問には関係ないと思うので、私はそれを取り除きました。そして最後に、ここにOnclickイベントを呼び出すボタンです：

    <tr> 
         <td> 
          <input class="botao" type="submit" value="Update" onclick="submitFrame()" style="width: 120px;"> 
         </td> 
        </tr> 

は私が助けに感謝します！

Answer 1

フォームは、送信するときにページをリフレッシュしています。 type=submitをtype=buttonに変更してください。

<input class="botao" type="button" value="Update" onclick="submitFrame()" style="width: 120px;"> 

---

<script> 
    function submitFrame(){ 
     document.getElementById('UpdIframe').style.display = "block"; 
     // Also handle your form submission/POST here 
    } 
</script> 

JSFiddle：https://jsfiddle.net/q3ceto1n/

参考文献：

Form Refresh

Handle POST outside form tag

Answer 2

もしあなたこの関数はまた、私はあなたがフォームを送信する際に、ページが、それはあなたが作ったJS機能をキャプチャしません、その場合にはリロードしますだと思いますが

<input class="botao" type="submit" value="Update" onclick="submitFrame(event)" style="width: 120px;"> 

と

<script> 
function submitFrame(e){ 
    e.preventDefault(); 
    document.getElementById('UpdIframe').style.display = "block"; 
} 
</script>