Question

我已经创建了一个simpleModal弹出窗口。我想将弹出窗口中的文本输入值返回到父页面上的asp文本框。

我已经阅读了与此类似的所有示例，但没有人回答我的问题。

我的弹出窗口是一个带文本输入的简单aspx页面。这是代码：

的JavaScript

  $(document).ready(function() {
    $("a#lookup").click(function () {
      //Load the Lookup page as a modal popup..
      $.modal('<iframe src="TestPopup.aspx" height="200" width="450" style="border:5">', {
        onOpen: function (dialog) {
            dialog.overlay.fadeIn('slow', function () {
                dialog.container.slideDown('100', function () {
                    dialog.data.fadeIn('fast');
            }); 
          }); 
        },
        preventDefault: true,
        containerCss: {
          backgroundColor: "#fff",
          borderColor: "#aaa",
          height: 530,
          padding: 5,
          width: 880,
          escClose: false
        },
        closeHTML: "<a href='#'>Close</a>",
        appendTo: 'form',
        persist: true,
        overlayClose: true,
        onClose: function (dialog) {
          var result = dialog.data.find("#msgText").val();
          $('#txtLookupReturn').attr('value', result);
          dialog.data.fadeOut('200', function () {
            dialog.container.slideUp('200', function () {
              dialog.overlay.fadeOut('200', function () {
                $.modal.close();
              }); 
            });
          });
        }
      }); 
    });    
  });

TestPopup.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestPopup.aspx.cs" Inherits="WebServicesTest.TestPopup" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">; 
<html xmlns="w3.org/1999/xhtml">; 
<head runat="server"> 
  <title></title> 
</head> 
<body> 
  <form id="form1" runat="server"> 
  <div> 
    <input id="msgText" type="text" value="I love jQuery!" /> 
  </div> 
  </form> 
</body> 
</html>

这是不起作用的代码行：

var result = dialog.data.find("#msgText").val();

$('#txtLookupReturn').attr('value', result);

当我尝试获取#msgText的值时，我没有得到任何错误，也没有任何价值。感谢任何帮助！

Answer 1

我认为您的选择代码应为：

$("iframe[src='TestPopup.aspx']").contents().find("#msgText").val();

选择iframe内部的元素有一些复杂性，可在this question和this blog post中解决。 This question讨论了使用JavaScript和iframe的权限。我不知道你的网页是如何组织的，所以我不知道你是否会遇到same origin policy的问题，但是无论如何都要读它是一件好事。

更新

我看你的弹出式HTML越多，我就越认为你不需要使用iframe。当我使用SimpleModal时，我通常将对话框HTML放在一个不可见的<div>中。 iframe将不必要地减慢并增加您的服务器流量。如果需要从服务器加载值，可能需要将其保留为iframe。但是，如果您只需要用户提供值，请在页面上将对话框表单包含为HTML。

从simplemodal iframe弹出窗口返回值到父级的文本框

的JavaScript

TestPopup.aspx

1 个答案:

更新