设置和检索 iframe 隐藏输入字段值的问题
我在设置或检索 iframe 的隐藏输入字段信息时遇到问题。
在初始页面，我点击“提交”按钮激活showBox功能并成功传递三个参数：名称、城市和州。 showBox 创建一个弹出框，其中 iframe 应该位于框的顶部并进行表单操作。我需要使用从 showBox 函数传递的值来设置三个隐藏输入字段的值。这是 showbox 函数的代码 -
function showBox(name, city, state)
{
var div = document.createElement('div');
div.style.zIndex = 1;
div.id = 'box';
div.style.position = (navigator.userAgent.indexOf('MSIE 6') > -1) ? 'absolute' : 'fixed';
div.style.top = '20px';
div.style.left = (width / 2) - (900 / 2) + 'px';
div.style.height = '500px';
div.style.width = '400px';
div.style.backgroundColor = 'white';
div.style.border = '2px solid silver';
div.style.padding = '20px';
document.body.appendChild(div);
alert("Name: " + name + ", City: " + city + ", State: " + state);
div.innerHTML = "<iframe id='infopage' src='" + 'info.html' + "' width='100%' height='95%'></iframe>";
// set value of the hidden input fields
var myname = $("#infopage #hiddenname").val(name);
var mycity = $("#infopage #hiddencity").val(city);
var mystate = $("#infopage #hiddenstate").val(state);
// check hidden input fields value - which come back blank so far
alert("Name from hidden field: " + $("#hiddenname").val() + ", City from hidden field: " + $("#hiddencity").val() + ", State from hidden field: " + $("#hiddenstate").val());
// create close window link
var a = document.createElement('a');
a.innerHTML = '<br /><br />Close window';
a.href = 'javascript:void(0)';
a.onclick = function()
{
document.body.removeChild(document.getElementById('box'));
};
div.appendChild(a);
}
尽管参数值已成功传递给 showBox 函数，但我还是无法使用参数成功设置隐藏输入字段值。
同时，这里是 info.html 的代码 -
<!DOCTYPE html>
<html>
<head>
<title>Sample person information</title>
<style type="text/css" title="currentStyle">
@import "css/core.css";
</style>
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="js/jsonreport.js"></script>
<script type="text/javascript" src="js/info.js"></script>
</head>
<body>
<div id="container">
<div class="full_width big" id="testname">
<br />
<!-- (it may take a while to load large files) -->
</div>
<br />
<input type="text" name="hiddenname" id="hiddenname" value="" />
<input type="hidden" name="hiddencity" id="hiddencity" value="" />
<input type="hidden" name="hiddenstate" id="hiddenstate" value=""/>
<input id="submit" type="button" value=" Enter " />
<div id="AjaxDiv"></div>
</div>
</body>
</html>
当单击“Enter”按钮时，将使用 iframe 中的隐藏字段值调用 ajax 函数。不知何故，我也很难从 iframe 中检索隐藏的输入字段值。
I am having trouble either to set or retrieve the hidden input fields information of iframe.
On the initial page, I click on "Submit" button to activate showBox function and pass three parameters, name, city, and state successfully. showBox creates a popup box where an iframe should sit on top of the box and do form manipulation. I need to set the value of the three hidden input fields with the value passed from the showBox function. Here is the code for showbox function -
function showBox(name, city, state)
{
var div = document.createElement('div');
div.style.zIndex = 1;
div.id = 'box';
div.style.position = (navigator.userAgent.indexOf('MSIE 6') > -1) ? 'absolute' : 'fixed';
div.style.top = '20px';
div.style.left = (width / 2) - (900 / 2) + 'px';
div.style.height = '500px';
div.style.width = '400px';
div.style.backgroundColor = 'white';
div.style.border = '2px solid silver';
div.style.padding = '20px';
document.body.appendChild(div);
alert("Name: " + name + ", City: " + city + ", State: " + state);
div.innerHTML = "<iframe id='infopage' src='" + 'info.html' + "' width='100%' height='95%'></iframe>";
// set value of the hidden input fields
var myname = $("#infopage #hiddenname").val(name);
var mycity = $("#infopage #hiddencity").val(city);
var mystate = $("#infopage #hiddenstate").val(state);
// check hidden input fields value - which come back blank so far
alert("Name from hidden field: " + $("#hiddenname").val() + ", City from hidden field: " + $("#hiddencity").val() + ", State from hidden field: " + $("#hiddenstate").val());
// create close window link
var a = document.createElement('a');
a.innerHTML = '<br /><br />Close window';
a.href = 'javascript:void(0)';
a.onclick = function()
{
document.body.removeChild(document.getElementById('box'));
};
div.appendChild(a);
}
Even though the parameters value got passed to the showBox function successfully, some how I just could not successfully set hidden input fields value with the parameters.
Meanwhile, here is the code for info.html -
<!DOCTYPE html>
<html>
<head>
<title>Sample person information</title>
<style type="text/css" title="currentStyle">
@import "css/core.css";
</style>
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="js/jsonreport.js"></script>
<script type="text/javascript" src="js/info.js"></script>
</head>
<body>
<div id="container">
<div class="full_width big" id="testname">
<br />
<!-- (it may take a while to load large files) -->
</div>
<br />
<input type="text" name="hiddenname" id="hiddenname" value="" />
<input type="hidden" name="hiddencity" id="hiddencity" value="" />
<input type="hidden" name="hiddenstate" id="hiddenstate" value=""/>
<input id="submit" type="button" value=" Enter " />
<div id="AjaxDiv"></div>
</div>
</body>
</html>
When click on the "Enter" button, an ajax function will be called using the hidden fields value from the iframe. Somehow I have difficult retrieving the hidden input fields value from the iframe also.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
从您在此处和 fiddler 上发布的代码中，
我看到 showbox() 没有被调用，
所以 iframe 永远不会被创建？
还可以尝试用此替换您的提交按钮（以测试它是否有效）
from the code you posted here and on fiddler,
i see that showbox() is not called,
so the iframe is never created?
also try replacing your submit button with this ( to test if it works )