使用 iframe 外部的按钮提交 iframe 表单-解网

问：

我有 contactus.html它的 iframe 只包含三个输入contact_inputs.php<iframe name="myframe" id="frame1" src="contact_inputs.php"></iframe>

和 ContactUs 中的按钮提交.html我想在 iframe 文件中提交表单contact_inputs.php使用 iframe 外部的按钮提交给php_form.php

联系我们：.html

   <iframe name="myframe" id="frame1" src="contact_inputs.php"></iframe>
   <form action="php_form.php" method="post">
   <input type="submit" name="DoIt" value="submit">
   </form>

contact_inputs.php

<form>

<input type="" name="cn">
<input type="" name="ex">
<input type="" name="cr">

</form>

JavaScript HTML

function sub(ev) {
        ev.preventDefault();
        let frame1 = document.getElementById("frame1");

        let parser = new DOMParser();
        let doc = parser.parseFromString(frame1.innerHTML, "text/html");

        let iframeForm = doc.body.querySelector("form");

        console.log(iframeForm);

        //access value of form input field via name also
        console.log(iframeForm.cn.value);
      }

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <iframe name="myframe" id="frame1" src="contact_inputs.php">
      <form id="iframe1Form">
        <input type="" name="cn" value ="HELLO"/>
        <input type="" name="ex" />
        <input type="" name="cr" />
      </form>
    </iframe>
    <form onsubmit="sub(event)">
      <input type="submit" name="DoIt" value="submit" />
    </form>

    
  </body>
</html>

使用 iframe 外部的按钮提交 iframe 表单

Submit iframe forms with button outside of iframe

评论

评论