Javascript 单击页面中的任何按钮时,使用Jquery文件上载时将打开文件对话框
我使用下面的HTML代码来实现文件上传Javascript 单击页面中的任何按钮时,使用Jquery文件上载时将打开文件对话框,javascript,jquery,html,css,file-upload,Javascript,Jquery,Html,Css,File Upload,我使用下面的HTML代码来实现文件上传 <span class="fileinput-button uploadBtn" id="btnUploadFile"><span>Add files</span><input id="fileupload" type="file" name="files[]" ></span> 如何避免这些问题 仅单击“btnUploadFile”按钮时,应触发文件对话框 如果我删除jquery.fileup
<span class="fileinput-button uploadBtn" id="btnUploadFile"><span>Add files</span><input id="fileupload" type="file" name="files[]" ></span>
如何避免这些问题
您的css非常混乱,span#btnuploaddfile span涵盖了所有内容 我猜你想要一个不显示输入的文件上传按钮,并且你正在使用。 尝试该问题的第二个答案,它更优雅,更容易理解-输入按钮具有可见性:隐藏,并且在另一个按钮上有一个单击事件处理程序(您的span上也可以有)
<input type="button" id="btnDownLoad" value="Download" onclick="blah();" />
<span class="fileinput-button uploadBtn" id="btnUploadFile"><span>Add files</span><input id="fileupload" type="file" name="files[]" ></span>
.fileinput-button {
position: relative;
overflow: hidden;
}
.fileinput-button input { // if i remove this block, other buttons didnt trigger file upload dialog. but i lost style
position: absolute;
top: 0;
right: 0;
margin: 0;
opacity: 0;
-ms-filter: 'alpha(opacity=0)';
font-size: 200px;
direction: ltr;
cursor: pointer;
}
/* Fixes for IE < 8 */
@media screen\9 {
.fileinput-button input {
filter: alpha(opacity=0);
font-size: 100%;
height: 100%;
}
$("#btnUploadFile").click(function () {
Upload();
});
function Upload() {
$('#fileupload').fileupload({
dataType: 'json',
url: '/Common/UploadFiles',
autoUpload: true,
done: function (e, data) {
alert("Upload Successfully Done");
}
}