【发布时间】：2012-11-18 13:19:39
【问题描述】：
我已经为这个问题挠了很久。我在页面上使用 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"> </td>
</tr>
</table>
</form>
</div>
【问题讨论】：
-
您在调试器工具上遇到任何错误吗？
-
可以在这里上传HTML代码吗？
-
我已将对话框 HTML 添加到问题中。
标签： jquery file user-interface upload dialog