从 iFrame 获取表单内容答案

【问题标题】：Get form content from iFrame从 iFrame 获取表单内容
【发布时间】：2015-05-28 01:29:05
【问题描述】：

I have a form, 2 questions are in separate iFrames, these options change depending on what options are chosen on the parent frame (they auto refresh when certain options are chosen), how can I get the option chosen in the iFrames back在提交表单时传递到父框架？父sn-p：

<td>Manager Name:</td>
<td><iframe name="manname" id="manname" frameborder="0" width="300" height="21" scrolling="no" src="./get_manager.php"></iframe>
<input type="hidden" id="starter_manname" name="starter_manname" width="300">
</td>

我希望starter_manname 包含从 iFrame 中选择的内容。这是 iFrame 内容的一部分：

<select id="starter_manname" name="starter_manname" width="300" class="textboxstyle">
<option selected value="">----- Select Manager -----</option>
<option value="CouldBeAnythingVal">CouldBeAnythingName</option>
</select>

iFrame 仅包含 <html>、<body> 和 <option> 标记，其中没有 <form> 或任何内容。我对 Javascript 毫无用处，我认为这就是答案，所以如果你能解释答案或指出正确的方向，我将不胜感激（尽管请不要使用 jQuery）

【问题讨论】：

标签： javascript html forms iframe

【解决方案1】：

您可以使用 jquery 的 .contents() 方法访问 iframe 内容。如果您有一个 ID 为“myframe”的 iframe 那么，你可以这样做：

    $('#myframe').contents().find('something')
    // or event bind events
    $('#myframe').contents().find('button').on('click', function(){  });

假设你在 iframe <iframe name="manname" id="manname" frameborder="0" width="300" height="21" scrolling="no" src="./get_manager.php"></iframe>中有内容

$(function(){
  var selectInframe = $('#manname').contents().find('#starter_manname');
  selectInframe.on('change', function(){
    var new_val = $(this).val();
    $('#starter_manname').val(starter_manname);
  });
});

没有 jquery，你可以使用 contentDocument

var selectInframe = document.getElementById('manname');
var selectInframeDocument = selectInframe.contentDocument;
// selectInframeDocument is the document form your iframe
// you can do selectInframeDocument.getElementByTagName('..') etc to access elements and bind

希望你能明白。

【讨论】：

谢谢，不用 JQuery 有什么办法吗？