【问题标题】:Trouble setting and retrieving value of hidden input fields of iframeiframe 的隐藏输入字段的设置和检索值问题
【发布时间】:2011-09-18 01:04:15
【问题描述】:

我无法设置或检索 iframe 的隐藏输入字段信息。

在初始页面,我点击“提交”按钮激活showBox功能,并成功传递了name、city和state三个参数。 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 中检索隐藏的输入字段值。

【问题讨论】:

  • 请格式化您的代码,并在可能的情况下删除对重现您的问题不重要的行。
  • 我将代码放在了 Fiddle 上。请参阅jsfiddle.net/qpMHf/4 获取代码。不知何故,我无法从 iframe 设置或检索隐藏的输入字段值。

标签: javascript hidden-fields frameset-iframe


【解决方案1】:

根据您在此处和 fiddler 上发布的代码, 我看到 showbox() 没有被调用, 所以永远不会创建 iframe?

也可以尝试用这个替换你的提交按钮(测试它是否有效)

<input id="submit" type="button" onclick="alert(document.getElementById('infopage').src);return false;" value="  Enter  " />

【讨论】:

  • showbox() 由 人员信息 调用调用程序,我没有问题通过 showbox 函数传递三个参数。应用以下语句时 - var myiframe = document.getElementById('infopage'); var frame = myiframe.contentDocument.getElementById('hiddenname'); alert("我的 iframe id: " + myiframe.id + ", frame: " + frame); - 回馈“我的 iframe id: infopage, frame: null” alert($("#infopage").contents().find("#hiddenname").val("Frank")); - 还给“[object Object]”
  • 您可以编辑您的问题并将此代码添加到其中吗?您将有更多机会得到答案。
  • 在 index.html jsfiddle.net/qpMHf/10 中获取代码 - • 当单击“使用 iframe 创建我的弹出窗口”链接时,会调用一个 js 函数 showBox(name, city, state),传递“hidname”的值,“hidcity”和状态值“ca”,同时创建一个弹出框。 • 框内是一个div 标签,包含带有测试的iframe。 html。 • 问题:需要使用通过showBox 传入的数据来设置test.html 上三个输入字段的值,以便进一步处理。如何在 iframe 内部访问 test.html 页面的文本输入字段,以便将传递的数据存储到“hiddenname”、“hiddencity”和“hiddenstate”?
  • 最后我可以使用以下语句设置 iframe 的表单输入字段值 - var ifr = $('#infopage'); // iframe 的 id ifr.contents().find("body #hiddenname").val(name).val(); ifr.contents().find("body #hiddencity").val(city).val(); ifr.contents().find("body #hiddenstate").val(state).val();该代码适用于 Firefox 和 IE,但不适用于 Chrome。我从zimbio.com/ASP.Net/articles/gsuiDzNz1rz/…得到信息
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-10-14
  • 2013-04-20
  • 2011-09-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多