Fatal编程技术网
  • javascript/
  • Javascript 如何从表单中获取数据并将其发布到iframe中？

Javascript 如何从表单中获取数据并将其发布到iframe中？

javascript html forms iframe

Javascript 如何从表单中获取数据并将其发布到iframe中？,javascript,html,forms,iframe,Javascript,Html,Forms,Iframe,所以我有一个表格 <fieldset> <legend>Post a comment:</legend> <form target="forum" method="post" action="forum.**SomeKindOfExtension**" > Name: <br /> <input type="text" name="fname" /><br />

所以我有一个表格

<fieldset>
<legend>Post a comment:</legend>
<form target="forum" method="post" action="forum.**SomeKindOfExtension**" >
                Name: <br />
        <input type="text" name="fname" /><br />
                Subject:<br />
        <input type="text" name="subject" size="50"/><br />
                Comment:<br />
<textarea name="comment" rows="10" cols="100">Hello,</textarea><br />

<input type="submit" value="Send" />
<input type="reset" value="Reset" />

</fieldset>
</form>

<iframe name="forum" src="forum.**SomeKindOfExtension**" 
width="900" height="500" ></iframe>


发表评论：
名称：



主题：



评论：

你好，
然后我想将数据（名称、主题和评论）放入iframe中

<fieldset>
<legend>Post a comment:</legend>
<form target="forum" method="post" action="forum.**SomeKindOfExtension**" >
                Name: <br />
        <input type="text" name="fname" /><br />
                Subject:<br />
        <input type="text" name="subject" size="50"/><br />
                Comment:<br />
<textarea name="comment" rows="10" cols="100">Hello,</textarea><br />

<input type="submit" value="Send" />
<input type="reset" value="Reset" />

</fieldset>
</form>

<iframe name="forum" src="forum.**SomeKindOfExtension**" 
width="900" height="500" ></iframe>
希望您能看到我的问题，即什么类型的文件将读取表单数据并在iframe窗口中显示它？当我查找答案时，人们似乎在使用javascript或php，但我似乎无法让任何代码为我工作

因此，如果有人能在这里帮助我，我将不胜感激。

在同一页面上使用iframe没有任何意义，因为当您单击submit按钮时，整个页面将被提交到另一个页面，该页面指定为表单的action属性

相反，您可以使用不同的按钮（而不是submit按钮）将数据发送到iframe，或者使用父页面，然后包括两个框架，即表单和iframe

这是第一个例子

mainpage.html

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>

          <iframe src="frame.html" width="100%" height="100%" name="someFrame"></iframe>

          <FORM name="form1">
               <INPUT type="button" value="Click Me" 
               onClick="someFrame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <FRAMESET cols="80%,20%">
          <FRAME SRC="left.html" name="left_frame">
          <FRAME SRC="right.html" name="right_frame">
     </FRAMESET>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM>
               <INPUT type="button" value="Click ME" 
               onClick="parent.right_frame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>


JavaScript示例
frame.html

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>

          <iframe src="frame.html" width="100%" height="100%" name="someFrame"></iframe>

          <FORM name="form1">
               <INPUT type="button" value="Click Me" 
               onClick="someFrame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <FRAMESET cols="80%,20%">
          <FRAME SRC="left.html" name="left_frame">
          <FRAME SRC="right.html" name="right_frame">
     </FRAMESET>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM>
               <INPUT type="button" value="Click ME" 
               onClick="parent.right_frame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>


JavaScript示例
这是第二个例子

parent.html

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>

          <iframe src="frame.html" width="100%" height="100%" name="someFrame"></iframe>

          <FORM name="form1">
               <INPUT type="button" value="Click Me" 
               onClick="someFrame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <FRAMESET cols="80%,20%">
          <FRAME SRC="left.html" name="left_frame">
          <FRAME SRC="right.html" name="right_frame">
     </FRAMESET>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM>
               <INPUT type="button" value="Click ME" 
               onClick="parent.right_frame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>


JavaScript示例
left.html

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>

          <iframe src="frame.html" width="100%" height="100%" name="someFrame"></iframe>

          <FORM name="form1">
               <INPUT type="button" value="Click Me" 
               onClick="someFrame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <FRAMESET cols="80%,20%">
          <FRAME SRC="left.html" name="left_frame">
          <FRAME SRC="right.html" name="right_frame">
     </FRAMESET>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM>
               <INPUT type="button" value="Click ME" 
               onClick="parent.right_frame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>


JavaScript示例
right.html

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>

          <iframe src="frame.html" width="100%" height="100%" name="someFrame"></iframe>

          <FORM name="form1">
               <INPUT type="button" value="Click Me" 
               onClick="someFrame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <FRAMESET cols="80%,20%">
          <FRAME SRC="left.html" name="left_frame">
          <FRAME SRC="right.html" name="right_frame">
     </FRAMESET>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM>
               <INPUT type="button" value="Click ME" 
               onClick="parent.right_frame.document.form1.text1.value='Me!'">
          </FORM>
     </BODY>
</HTML>

<HTML>
     <HEAD>
          <TITLE>JavaScript Example</TITLE>
     </HEAD>

     <BODY>
          <FORM name="form1">
               <INPUT type="text" name="text1" size="25" value="">
          </FORM>
      </BODY>
</HTML>


JavaScript示例
人们正在为此使用Javascript。使用PHP意味着将表单提交到服务器，这将刷新整个页面，而不仅仅是iframe。您的iframe在同一页面上吗？您希望如何读取数据？单击按钮或用户在文本框中键入时？@Searock iframe位于同一页面上，我希望通过单击按钮将数据读入iframe：@Searoc，如何显示？作为文本，作为输入？@david我怎么知道？：）OP询问后端服务或api，该服务或api将接受表单数据并做出响应。