4

多年来,我一直在为此挠头。我在页面上使用 uploadifive 来允许文件上传,这工作正常。现在,当我将浏览按钮/队列放在 jQuery UI 对话框中时,单击“浏览”按钮时文件浏览器不会打开。

在下面的代码中,我将 uploadifive 脚本包装在一个函数中,然后在对话框打开时尝试调用该函数,但它仍然不起作用????“浏览”按钮按原样显示,但在单击时不执行任何操作。

有解决方法吗?

谢谢,

    // File upload wrapped in function
    function upbind(){
        $('#file_upload').uploadifive({
            'auto'             : true,
            //'checkScript'      : 'check-exists.php',
            'formData'         : {
                                   'timestamp' : '1234567890',
                                   'token'     : '1234567890'
                                 },
            'queueID'          : 'queue',
            'uploadScript'     : 'uploadify/uploadifive.php',
            'queueSizeLimit'   : 1,
            'multi'            : false,
            'buttonText'       : 'BROWSE',
            //'removeCompleted'  : true,
            'onSelect'         : function(file) {
                                    $(".uploadifive-button").css("display", "none");
                                },
            'onCancel'         : function() {
                                    $(".uploadifive-button").css("display", "inherit");
                                },                  
            'onUploadComplete' : function(file, data) { console.log(data); alert('The file ' + data + ' uploaded successfully.');}

        });
    }

    // Call upbind script
    upbind();

    // Process dialog box
    $("#dialog-add-product").dialog({
        autoOpen: false,
        resizable: false,
        width: 400,
        modal: true,
        open: function(){
            $(this).parent().find('button:nth-child(2)').focus();
            upbind();
        },
        buttons: {
            Ok: function(){
                // Function here

            },
            Cancel: function() {
                // Function here

                $(this).dialog( "close" );
            }
        }
    }); // End add product dialog

对话框 HTML 在这里;

<div id="dialog-add-product" class="dialog_add" title="Add product">
<form name="formAddProduct" id="formAddProduct" method="post" action="">
<input type="hidden" name="action" value="" id="addcat" />
<table>
      <tr>
        <td height="10" align="left" valign="middle" class="smallText" width="120"></td>
        <td height="10" align="left" valign="middle"></td>
      </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Product title:</td>
        <td height="31" align="left" valign="middle"><input name="fields-ptitle" type="text" class="inputBoxAdd editstatus" id="fields-ptitle" tabindex="5" value="" /></td>
      </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Category:</td>
        <td height="31" align="left" valign="middle"><label for="fields-pcategory"></label>
          <select name="fields-pcategory" id="fields-pcategory" class="inputBoxAdd editstatus">
                            <option value="19">Door parts</option>
                            <option value="1">Hinges</option>
                            <option value="21">Testing 222</option>
                        </select></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Product code:</td>
        <td height="31" align="left" valign="middle"><input name="fields-pcode" type="text" class="inputBoxAdd editstatus" id="fields-pcode" tabindex="5" value="" /></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Quantity:</td>
        <td height="31" align="left" valign="middle"><input name="fields-pqty" type="text" class="inputBoxAdd editstatus" id="fields-pqty" tabindex="5" value="" /></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Trade price (£):</td>
        <td height="31" align="left" valign="middle"><input name="fields-pprice" type="text" class="inputBoxAdd editstatus" id="fields-pprice" tabindex="5" value="" /></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Clearance price (£):</td>
        <td height="31" align="left" valign="middle"><input name="fields-pclearance" type="text" class="inputBoxAdd editstatus" id="fields-pclearance" tabindex="5" value="" /></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Unit:</td>
        <td height="31" align="left" valign="middle"><input name="fields-punit" type="text" class="inputBoxAdd editstatus" id="fields-punit" tabindex="5" value="" /></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Description:</td>
        <td height="31" align="left" valign="middle"><textarea name="fields-pdescription" id="fields-pdescription" cols="30" rows="5"></textarea></td>
  </tr>
      <tr>
        <td align="left" valign="middle" class="smallText">Image:</td>
        <td align="left" valign="middle"><div id="queue"></div>
    <input id="file_upload" name="file_upload" type="file" multiple></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText">Active:</td>
        <td height="31" align="left" valign="middle"><input name="fields-pactive" type="checkbox" id="fields-pactive" value="1" /></td>
  </tr>
      <tr>
        <td height="31" align="left" valign="middle" class="smallText"><div class="savetick"><img src="images/accept.png" width="24" height="24" /></div><div class="savespinner"><img src="images/savespin.gif" width="16" height="16" /></div></td>
        <td height="31" align="left" valign="middle">&nbsp;</td>
      </tr>
</table>
</form>
</div>
4

3 回答 3

5

显然该选项有问题modal: true,它阻止了windows文件,然后设置为modal: false及其工作。

// Process dialog box
$("#dialog-add-product").dialog({
    ...
    modal: false,
    open: function(){
        $(this).parent().find('button:nth-child(2)').focus();
        upbind();
    },
    ...
}); // End add product dialog
于 2012-12-18T05:53:40.660 回答
0

以下是一些观察。

我无法使用您的代码.uploadifive({。我不得不用.uploadify({在演示页面上找到的替换它。该更改至少使代码在jsfiddle中正确运行。

其次,我会给你代码另一个审查,因为使用默认的 uploadify 代码,浏览器似乎工作得很好。

工作示例:http: //jsfiddle.net/t6hHr/2/

于 2012-12-19T00:48:09.530 回答
0

首先,将您div的表单标签放入并尝试一下。

即使我有同样的问题。

查看geek给出的解决方案

希望这可以帮助。

于 2012-12-18T06:06:58.260 回答