在 programmaticaly上的IE8中调用更改事件
Primefaces 5
我在代码中来上传文件。这个input -Tag是从PrimeFaces组件
自动生成的。我想隐藏input按钮元素并使用我自己的样式按钮进行上传。
所以这是风格的按钮。
这在FF，Chrome和IE9,10,11中起作用。但在IE8中，上传阶段没有任何反应。 将显示“选择文件”对话框。 生成的input file具有JQuery更改事件。 我相信这个事件不会被调用，因为如果我点击input file按钮它会进入所有浏览器。
我试过了
但它没有帮助。
我也试过了
$('#formId\\:uploaderId .ui-fileupload-choose input').change(function () { // Cause the change() event // to be fired in IE8 et. al. //some checks against recursion. alert("I'm in change"); $('#formId\\:uploaderId .ui-fileupload-choose input').change(); });
调用函数中的函数但它也没有帮助。
在这种情况下我该怎么办？
这是由于IE中的安全限制。
当有 ，其中任何一个都有
-
display:none -
visbilty:hidden -
opacity: 0
如果手动调用（javascript点击），IE会阻止上传文件的请求。
在PrimeFaces案例中，输入文件的opacity: 0 。
以下是没有CSS额外风格的输入文件的样子：
解决方法是将输入文件移动到p:fileUpload组件之外，这样它就可以松开CSS角色，并使用按钮样式将其附加到span或div，这将导致实际单击文件输入。
按键
Upload File
JavaScript的
$(document).ready(function() { $('.ui-fileupload-buttonbar span input[type=file]').addClass('uploadBtn'); $('.btn-file').append($('.uploadBtn')); });
东西链接这个：
现在为了让它看起来很好并且在包括IE在内的所有浏览器上同时工作，应该添加一些CSS。 首先忽略前两个CSS类btn btn-primary （颜色，填充等…）
btn-file是自定义技巧：
.btn-file { position: relative; overflow: hidden; } .btn-file input[type=file] { position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; font-size: 999px; text-align: right; filter: alpha(opacity=0); opacity: 0; cursor: inherit; display: block; }
最终结果是在后台输入文件的按钮：
应该隐藏p:fileUpload组件：
为了显示错误消息，您可以对该输入文件使用onchange事件：
$('.uploadBtn').change(function() { var a = $('.ui-fileupload-content').html(); var b = $('#editUserUploadMessages').html(a); })
其中#editUserUploadMessages是包含所有消息的div。
最后隐藏其他上传的文件：
#editUserUploadMessages .ui-fileupload-files { display: none; }
你可以在github和Demo上找到一个小例子
另外解决了Hatem的优秀答案。 它正在使用这个SO答案 。
您可以使用html标签将单击转发到输入按钮。
这样，错误将显示在包含
- 添加样式显示：无输入type =“file”
- 在输入类型文件的位置创建新文本框和按钮
- 单击按钮单击文件上传按钮时创建jsfunction