如何从表单获取输入框值到iframe？答案

【问题标题】：How to get the input box value from form to iframe?如何从表单获取输入框值到iframe？
【发布时间】：2014-01-13 20:50:18
【问题描述】：

<html>
  <script type="text/javascript">  
    function showIFrame() {  
      var iframe = document.getElementById("output");  
      iframe.style.display="block";  
    }  
  </script>
  <form method="get"  name="search" id="search"  target="carsearch">
    <b>Enter Text</b><input type="text" id="pv2" name="pv2"/>
    <input type="submit" value="Report Generation" class="submitBtn" id="SearchCarButton" onclick="showIFrame()"/>

    <iframe id="output" style="border:1px solid;width:1000px;height:500px;" src="/00ON0000000FOHS?pv2=" name="carsearch">
    </iframe>
  </form>

</html>

我需要获取该输入值并将其保存在 iframe Src="/00ON0000000FOHS?pv2=(value)" 中吗？我该怎么做？

它必须取值并加载

【问题讨论】：

iframe 的 ID 是 output 还是 myiframe?
抱歉输出不是 myiframe

标签： javascript jquery html forms iframe

【解决方案1】：

试试这个

<html>
<script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
<script type="text/javascript">  
 function showIFrame()
{
 var url='/00ON0000000FOHS?pv2=('+$('#pv2').val()+')';
  $('#output').show();
 $('#output').attr('src', url);
}
</script>
    <form method="get"  name="search" id="search"  target="carsearch">
        <b>Enter Text</b><input type="text" id="pv2" name="pv2"/>
        <input type="submit" value="Report Generation" class="submitBtn" id="SearchCarButton" onclick="showIFrame()"/>

     <iframe id="output" style="display:none;border:1px solid;width:1000px;height:500px;" src="/00ON0000000FOHS?pv2=" name="carsearch">
</iframe>
</form>

</html>

DEMO

【讨论】：

感谢您的回答，但它没有刷新 iframe
每当您的函数调用时，它都会刷新 iframe src 值
它对我不起作用。当我们直接给 src="/00ON0000000FOHS?pv2=account3" 时，它正在 iframe 中显示并显示相同。有什么方法可以直接从文本框中获取。我试过这样 src="/00ON0000000FOHS?pv2= $('#pv2').val()" 。这也不起作用。然后我尝试使用这个 var url='/00ON0000000FOHS?pv2=account3' 直接分配值来检查这不是采取。你能建议任何其他方式

【解决方案2】：

是的，即使该站点来自另一个域，它也应该是可能的。

$('input:button[name=save]').click(function() {
        var name = $('iframe[name=select_frame]').contents().find('#select_name').val();
    });

【讨论】：

【解决方案3】：

我建议你在 iframe 中添加data-src 属性

JavaScript

function showIFrame() {
    var myIframe = $('#output');
    myIframe.attr('src', myIframe.attr('data-src') + $('#pv2').val());
    myIframe.show();
}

HTML：

<iframe id="output" src="" data-src="/00ON0000000FOHS?pv2=" name="carsearch" style="display:none;border:1px solid;width:1000px;height:500px;" >
</iframe>

【讨论】：