jQuery 在 iframe 内调整大小的问题

发布于 2024-09-07 15:43:39 字数 3491 浏览 3 评论 0原文

我有第一页。哪里有一个链接,可以打开带有 iframe 的 jQuery 对话框,其中有第二页。 第二页内有一个可调整大小的文本区域。 实际上,只有当我严格不使用 iframe 打开第二页时,文本区域才能调整大小,但在 iframe 内不能调整大小。 如何解决?

更新: 这是我第一页的 html 代码:

  1.   
    正在加载...
  2.   < iframe id=“SystemFrame” src=“”scrolling=“no”frameborder=“0”>
* 此来源使用源代码荧光笔突出显示代码。

这是打开对话框的脚本:

  1. function showSystemDialog(propertyName, id_prov, psysName, currentItemForTick) {
  2.   $('.loadingDivForDialog').show( );
  3.   $('#SystemFrame').hide();
  4.  
  5.   var defaultSrc = "设置.aspx?pro=" + propertyName + "&id_prov=" + id_prov;
  6.   $("#systemFrame").attr('src', String(defaultSrc));< /li>
  7.  
  8.   $("#dialog-system").dialog({
  9.     可调整大小: false ,
  10.    高度:300,
  11.     宽度:680,
  12.   模态:true,
  13.    位置:'center',
  14.     按钮:{}
  15.  });
  16.   $('#SystemFrame').load(function() {
  17.     $('.loadingDivForDialog').hide();
  18.    $('#SystemFrame').show();
  19.      $('#SystemFrame').contents().find("input[value='Update']").click(function() {
  20.  
  21.     var obj = $("#" + currentItemForTick);
  22.  
  23.        if (obj.get(0).tagName == "INPUT") {
  24.       obj.attr( '已检查', true);
  25.      }
  26.      其他{
  27.       obj = window.parent.$("input[value='" + psysName + "']");
  28. < li> 
  29.        obj.attr("checked", true);
  30.     ;   }
  31.    });
  32.  
  33.      $('#SystemFrame').contents().find("input[value='取消']").click(function() { $("#dialog-system").dialog("close") }) ;
  34.  
  35.     $("#dialog-system").dialog("选项", "高度", parseInt($(' #SystemFrame').contents().height(), 10) + 35);
  36.   });
  37.   返回 false;
  38. }
* 此源代码已使用 源代码荧光笔

是第二页的文本区域和脚本:

  1.  
* 此源代码已用 源代码荧光笔

UPD:有什么想法吗?

I have a first page. Where is a link which open jQuery Dialog with iframe with second page inside.
There is a resizable textarea inside second page.
Actually the textarea resizable only when I open the second page strictly without iframe, but it's not resizable inside iframe.
How can it be fixed?

UPD:
This is my html code from first page:

  1. <div id="dialog-system" title="system settings">
  2.   <div class="loadingDivForDialog"><img src="Control/Image/loading.gif" alt="loading..." /></div>
  3.   <iframe id="SystemFrame" src="" scrolling="no" frameborder="0"></iframe>
  4. </div>

* This source code was highlighted with Source Code Highlighter.

this is script to opent dialog box:

  1. function showSystemDialog(propertyName, id_prov, psysName, currentItemForTick) {
  2.   $('.loadingDivForDialog').show();
  3.   $('#SystemFrame').hide();
  4.  
  5.   var defaultSrc = "Settings.aspx?pro=" + propertyName + "&id_prov=" + id_prov;
  6.   $("#systemFrame").attr('src', String(defaultSrc));
  7.  
  8.   $("#dialog-system").dialog({
  9.     resizable: false,
  10.     height: 300,
  11.     width: 680,
  12.     modal: true,
  13.     position: 'center',
  14.     buttons: {}
  15.   });
  16.   $('#SystemFrame').load(function() {
  17.     $('.loadingDivForDialog').hide();
  18.     $('#SystemFrame').show();
  19.     $('#SystemFrame').contents().find("input[value='Update']").click(function() {
  20.  
  21.       var obj = $("#" + currentItemForTick);
  22.  
  23.       if (obj.get(0).tagName == "INPUT") {
  24.         obj.attr('checked', true);
  25.       }
  26.       else {
  27.         obj = window.parent.$("input[value='" + psysName + "']");
  28.  
  29.         obj.attr("checked", true);
  30.       }
  31.     });
  32.  
  33.     $('#SystemFrame').contents().find("input[value='Cancel']").click(function() { $("#dialog-system").dialog("close") });
  34.  
  35.     $("#dialog-system").dialog("option", "height", parseInt($('#SystemFrame').contents().height(), 10) + 35);
  36.   });
  37.   return false;
  38. }

* This source code was highlighted with Source Code Highlighter.

this is textarea and script from the second page:

  1. <textarea name="ctl00$ContentPlaceHolderBody$ctrl02$fldText" rows="2" cols="20" id="ctl00_ContentPlaceHolderBody_ctrl02_fldText" class="textbox"></textarea>
  2.  
  3. <script type="text/javascript">$(function() {
  4.   $("#ctl00$ContentPlaceHolderBody$ctrl02$fldText").resizable({
  5.     handles: "se",
  6.     maxWidth: 340,
  7.     minWidth: 196,
  8.     minHeight: 18
  9.   });
  10. });</script>

* This source code was highlighted with Source Code Highlighter.

UPD: Any ideas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

伴我心暖 2024-09-14 15:43:39

当页面上有 iframe 时,我在调整大小时遇到​​类似的问题。我开始得出这样的结论:iframe 正在阻止相关的鼠标处理程序访问 jQuery 中的调整大小逻辑。

严格来说这不是一个解决方案,但它可能会为某人指明正确的方向。

更新:请参阅此 jQuery 票证的最后评论,了解潜在修复的更多详细信息 http://bugs.jqueryui。 com/ticket/3176

I'm having a similar problem with resizing when there are iframes on the page. I'm starting to come to the conclusion that the iframe is preventing the relevant mouse handlers getting through to the resize logic in jQuery.

Not strictly a solution, but it might point someone in the right direction.

UPDATE: See the last comment on this jQuery ticket for more details of a potential fix http://bugs.jqueryui.com/ticket/3176

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文