在 Jquery UI 对话框中上传 =>铬和歌剧虫子

发布于 2024-11-05 17:23:22 字数 1628 浏览 4 评论 0原文

我有以下代码:

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" media="screen" href="jquery-ui-1.8.9.custom.css" />
        <script type="text/javascript" src="jquery-1.5.min.js"></script>
        <script type="text/javascript" src="jquery-ui-1.8.9.custom.min.js"></script>
        <script type="text/javascript" src="jquery.uploadify.js"></script>
    </head>
    <body>
        <script type="text/javascript">
            manualLightboxContent = function ()
            {
                $("#dialogContent").html($('#module_wrapper').html());
                $("#dialogContent").dialog( { 'modal': true } );
            }
        </script>
        <a href="#" onclick="manualLightboxContent();">Open</a>
        <div id="dialogContent" style="display:none;"></div>

        <div id="module_wrapper" style="display:none;">
            <script type="text/javascript">
            $().ready(function() {
                $('#uploadFile').uploadify({
                    'swf'  : 'uploadify.swf',
                    'fileObjName' : "uploadFile"
                });
            });
            </script>
            <input id="uploadFile" type="file" name="uploadFile" />
        </div>
    </body>

</html>

我找不到原因,但在 Chrome 中,我无法打开浏览窗口。就像有一些看不见的 div 漂浮在 swf 上一样。

在 Opera 中,该错误不太重要:SELECT FILES 文本位于 swf 下方而不是上方。

如果 uploadify 位于 jquery UI 对话框之外,则它可以正常工作。

谁能解释一下为什么会出现这个错误?

编辑: 使用上传3。

I have the following code:

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" media="screen" href="jquery-ui-1.8.9.custom.css" />
        <script type="text/javascript" src="jquery-1.5.min.js"></script>
        <script type="text/javascript" src="jquery-ui-1.8.9.custom.min.js"></script>
        <script type="text/javascript" src="jquery.uploadify.js"></script>
    </head>
    <body>
        <script type="text/javascript">
            manualLightboxContent = function ()
            {
                $("#dialogContent").html($('#module_wrapper').html());
                $("#dialogContent").dialog( { 'modal': true } );
            }
        </script>
        <a href="#" onclick="manualLightboxContent();">Open</a>
        <div id="dialogContent" style="display:none;"></div>

        <div id="module_wrapper" style="display:none;">
            <script type="text/javascript">
            $().ready(function() {
                $('#uploadFile').uploadify({
                    'swf'  : 'uploadify.swf',
                    'fileObjName' : "uploadFile"
                });
            });
            </script>
            <input id="uploadFile" type="file" name="uploadFile" />
        </div>
    </body>

</html>

I can't find why, but in chrome, I'm not able to open the browse windows. Exactly like if there was some invisible div floating over the swf.

In opera, the bug is less important: the SELECT FILES text is under the swf instead of over.

If uploadify is outside a jquery UI dialog, it works just fine.

Can anyone explain me why this bug occur ?

Edit:
Using Uploadify 3.

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

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

发布评论

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

评论(3

寂寞花火° 2024-11-12 17:23:22

我最近遇到了同样的问题,在查看了一些代码后,我注意到第 193 行有以下内容:

jQuery('#' + swfuploadify.movieName).css({position: 'absolute', 'z-index': 1, 'left' : '0px'});

只需将 z-index 更改为 9999 对我有用

jQuery('#' + swfuploadify.movieName).css({position: 'absolute', 'z-index': 9999, 'left' : '0px'});

I recently had the same problem, after looking up a bit at the code i have noticed the following at line 193:

jQuery('#' + swfuploadify.movieName).css({position: 'absolute', 'z-index': 1, 'left' : '0px'});

Simply changing the z-index to 9999 worked for me

jQuery('#' + swfuploadify.movieName).css({position: 'absolute', 'z-index': 9999, 'left' : '0px'});
薄荷→糖丶微凉 2024-11-12 17:23:22

如果您不想更改核心代码,只需将以下 css 规则添加到您的页面即可。

.swfupload {
    z-index: 100000 !important;
}

If you don't want to change core codes just add the following css rule to your page.

.swfupload {
    z-index: 100000 !important;
}
浅紫色的梦幻 2024-11-12 17:23:22

我已经尝试了所有的解决方案,但没有效果。

页面中有3个uploadify实例。

如图所示,主页上有一个对话框或覆盖 div。当我单击“选择文件”时,它不显示浏览对话框

http://lh5.ggpht.com/cZ-V3g6IwQ2ke-9NDfv3GYh8ra9YypCs4V60Md_s7W3Rawzg2IcT2WT9HoqX40kaSstF=s170

这是页面的源代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta name="generator" content=
  "HTML Tidy for Linux/x86 (vers 11 February 2007), see www.w3.org" />

  <title></title>
</head>

<body>
  <div id="upload_vi" style=
  "background-color:#e8e8e8; border: 1px solid rgb(0, 0, 0); position:absolute; display:none; width:280px; padding: 4px;"
  class="ui-draggable">
    <div style="padding:5px;">
      <a id="close" onclick="$('#upload_vi').hide()" style="color:#888888; float: right"
      name="close"><img src="images/close_btn.jpg" border="0" /></a>
    </div><br />

    <form id="fiuploader2" name="fiuploader2">
      <input type="hidden" name="edit_item_id2" id="edit_item_id2" value="" /><br />
      <input type="hidden" name="spicname2" id="spicname2" value="" /><input type=
      "hidden" name="sorgname2" id="sorgname2" value="" /> <input type="file2" name=
      "file2" id="file2" style="display: none;" /><object type=
      "application/x-shockwave-flash" data="/js/uplodify/uploadify.swf" width="120"
      height="30" id="file2Uploader" style="visibility: visible;">
        <param name="quality" value="high" />
        <param name="wmode" value="transparent" />
        <param name="allowScriptAccess" value="sameDomain" />
        <param name="flashvars" value=
        "uploadifyID=file2&pagepath=/members/&script=http://localhost/members/multiSrv.php&folder=/files/cityguide/&scriptData=asy_up%3D1%26cityguide%3D1%26video%3D1&width=120&height=30&wmode=transparent&method=POST&queueSizeLimit=1&simUploadLimit=1&fileDesc=Videos (.avi, .flv)&fileExt=*.avi;*.flv&sizeLimit=2000000&fileDataName=Filedata" />
      </object>

      <div id="file2Queue" class="uploadifyQueue"></div><br />
      <a onclick="$('#file2').uploadifyUpload()" style=
      "color: darkblue; font-size: 12px; cursor: pointer; cursor: hand; text-decoration: underline;">
      <b>Upload</b></a><br />

      <div id="hlptxt2">
        Please choose a .avi, .flv file.<br />
        Maximum size 2MB
      </div><br />
      <input type="hidden" name="type2" id="type2" value="videos" />
    </form>
  </div>
</body>
</html>

I have tried all the solutions but to no avail.

There are 3 instances of uploadify in the page.

As shown in the image there is a dialog box or overlay div over the main page. When I click over the SELECT FILES it does not display the browse dialog box

http://lh5.ggpht.com/cZ-V3g6IwQ2ke-9NDfv3GYh8ra9YypCs4V60Md_s7W3Rawzg2IcT2WT9HoqX40kaSstF=s170

This are the source code for the page

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta name="generator" content=
  "HTML Tidy for Linux/x86 (vers 11 February 2007), see www.w3.org" />

  <title></title>
</head>

<body>
  <div id="upload_vi" style=
  "background-color:#e8e8e8; border: 1px solid rgb(0, 0, 0); position:absolute; display:none; width:280px; padding: 4px;"
  class="ui-draggable">
    <div style="padding:5px;">
      <a id="close" onclick="$('#upload_vi').hide()" style="color:#888888; float: right"
      name="close"><img src="images/close_btn.jpg" border="0" /></a>
    </div><br />

    <form id="fiuploader2" name="fiuploader2">
      <input type="hidden" name="edit_item_id2" id="edit_item_id2" value="" /><br />
      <input type="hidden" name="spicname2" id="spicname2" value="" /><input type=
      "hidden" name="sorgname2" id="sorgname2" value="" /> <input type="file2" name=
      "file2" id="file2" style="display: none;" /><object type=
      "application/x-shockwave-flash" data="/js/uplodify/uploadify.swf" width="120"
      height="30" id="file2Uploader" style="visibility: visible;">
        <param name="quality" value="high" />
        <param name="wmode" value="transparent" />
        <param name="allowScriptAccess" value="sameDomain" />
        <param name="flashvars" value=
        "uploadifyID=file2&pagepath=/members/&script=http://localhost/members/multiSrv.php&folder=/files/cityguide/&scriptData=asy_up%3D1%26cityguide%3D1%26video%3D1&width=120&height=30&wmode=transparent&method=POST&queueSizeLimit=1&simUploadLimit=1&fileDesc=Videos (.avi, .flv)&fileExt=*.avi;*.flv&sizeLimit=2000000&fileDataName=Filedata" />
      </object>

      <div id="file2Queue" class="uploadifyQueue"></div><br />
      <a onclick="$('#file2').uploadifyUpload()" style=
      "color: darkblue; font-size: 12px; cursor: pointer; cursor: hand; text-decoration: underline;">
      <b>Upload</b></a><br />

      <div id="hlptxt2">
        Please choose a .avi, .flv file.<br />
        Maximum size 2MB
      </div><br />
      <input type="hidden" name="type2" id="type2" value="videos" />
    </form>
  </div>
</body>
</html>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文