无法在 ui-dialog 中打开图像文件 - IE 11 中的问题
Unable to open image file in ui-dialog - Issue in IE 11
我可以在 IE 和 Chrome 浏览器中使用 .pdf 文件。但在 IE 中出现图像类型文件的以下错误。
下面是我的对话框函数。
<script type="text/javascript">
function Downloadfile(x) {
var jquery = $;
var empCode = $("#EmpCode").val();
var fileName = $(x).closest("tr").find('td:eq(0)').text();
var actualfileName = $(x).closest("tr").find('td:eq(1)').text();
jquery("#dialog").dialog({
modal: true,
title: actualfileName,
width: 950,
height: 550,
open: function () {
jquery('.ui-dialog').css('z-index', 2000); jquery('.ui-widget-overlay').css('z-index', 1500);
jquery('.ui-dialog-titlebar').css({ "background": "white", "border": "none", "text-align": "left", "font-size": "normal" });
jquery('span').css({ "text-align": "left", "font-size": "normal" });
var object = "<object data=\"http://mysitename.com/filepath/{FileName}\" type=\"application/pdf\" width=\"900px\" height=\"500px\">";
object += "If you are unable to view file, you can download from <a href = \"http://mysitename.com/filepath/{FileName}\">here</a>";
object += " or download <a target = \"_blank\" href = \"http://get.adobe.com/reader/\">Adobe PDF Reader</a> to view the file.";
object += "</object>";
object = object.replace(/{FileName}/g, "/" + fileName);
jquery("#dialog").html(object);
}
});
}
</script>
我通过检查文件类型和要在对话框中加载的文件的扩展名解决了这个问题,并添加了一个额外的条件,如果文件是图像类型,如下所示。
我为图像添加了 img
标签,为要加载的图像文件的路径添加了 src
。
<script type="text/javascript">
function Downloadfile(x) {
var jquery = $;
var empCode = $("#EmpCode").val();
var fileName = $(x).closest("tr").find('td:eq(0)').text();
var actualfileName = $(x).closest("tr").find('td:eq(1)').text();
var validExtensions = ["jpg", "jpeg", "gif", "png"];
var file = fileName.split('.').pop();
jquery("#dialog").dialog({
modal: true,
title: actualfileName,
width: 950,
height: 550,
open: function () {
jquery('.ui-dialog').css('z-index', 2000); jquery('.ui-widget-overlay').css('z-index', 1500);
jquery('.ui-dialog-titlebar').css({ "background": "white", "border": "none", "text-align": "left", "font-size": "normal" });
jquery('span').css({ "text-align": "left", "font-size": "normal" });
var object = "<object data=\"http://mysitename.com/filepath/{FileName}\" type=\"application/pdf\" width=\"900px\" height=\"500px\">";
object += "If you are unable to view file, you can download from <a href = \"http://mysitename.com/filepath/{FileName}\">here</a>";
object += " or download <a target = \"_blank\" href = \"http://get.adobe.com/reader/\">Adobe PDF Reader</a> to view the file.";
object += "</object>";
object = object.replace(/{FileName}/g, "/" + fileName);
//For image files
var image = "<img src=\"http://mysitename.com/filepath/{FileName}\" width=\"900px\" height=\"500px\">";
image = image.replace(/{FileName}/g, "/" + fileName);
if (validExtensions.indexOf(file) != -1) {
jquery("#dialog").html(image);
} else {
jquery("#dialog").html(object);
}
}
});
}
</script>
我可以在 IE 和 Chrome 浏览器中使用 .pdf 文件。但在 IE 中出现图像类型文件的以下错误。
下面是我的对话框函数。
<script type="text/javascript">
function Downloadfile(x) {
var jquery = $;
var empCode = $("#EmpCode").val();
var fileName = $(x).closest("tr").find('td:eq(0)').text();
var actualfileName = $(x).closest("tr").find('td:eq(1)').text();
jquery("#dialog").dialog({
modal: true,
title: actualfileName,
width: 950,
height: 550,
open: function () {
jquery('.ui-dialog').css('z-index', 2000); jquery('.ui-widget-overlay').css('z-index', 1500);
jquery('.ui-dialog-titlebar').css({ "background": "white", "border": "none", "text-align": "left", "font-size": "normal" });
jquery('span').css({ "text-align": "left", "font-size": "normal" });
var object = "<object data=\"http://mysitename.com/filepath/{FileName}\" type=\"application/pdf\" width=\"900px\" height=\"500px\">";
object += "If you are unable to view file, you can download from <a href = \"http://mysitename.com/filepath/{FileName}\">here</a>";
object += " or download <a target = \"_blank\" href = \"http://get.adobe.com/reader/\">Adobe PDF Reader</a> to view the file.";
object += "</object>";
object = object.replace(/{FileName}/g, "/" + fileName);
jquery("#dialog").html(object);
}
});
}
</script>
我通过检查文件类型和要在对话框中加载的文件的扩展名解决了这个问题,并添加了一个额外的条件,如果文件是图像类型,如下所示。
我为图像添加了 img
标签,为要加载的图像文件的路径添加了 src
。
<script type="text/javascript">
function Downloadfile(x) {
var jquery = $;
var empCode = $("#EmpCode").val();
var fileName = $(x).closest("tr").find('td:eq(0)').text();
var actualfileName = $(x).closest("tr").find('td:eq(1)').text();
var validExtensions = ["jpg", "jpeg", "gif", "png"];
var file = fileName.split('.').pop();
jquery("#dialog").dialog({
modal: true,
title: actualfileName,
width: 950,
height: 550,
open: function () {
jquery('.ui-dialog').css('z-index', 2000); jquery('.ui-widget-overlay').css('z-index', 1500);
jquery('.ui-dialog-titlebar').css({ "background": "white", "border": "none", "text-align": "left", "font-size": "normal" });
jquery('span').css({ "text-align": "left", "font-size": "normal" });
var object = "<object data=\"http://mysitename.com/filepath/{FileName}\" type=\"application/pdf\" width=\"900px\" height=\"500px\">";
object += "If you are unable to view file, you can download from <a href = \"http://mysitename.com/filepath/{FileName}\">here</a>";
object += " or download <a target = \"_blank\" href = \"http://get.adobe.com/reader/\">Adobe PDF Reader</a> to view the file.";
object += "</object>";
object = object.replace(/{FileName}/g, "/" + fileName);
//For image files
var image = "<img src=\"http://mysitename.com/filepath/{FileName}\" width=\"900px\" height=\"500px\">";
image = image.replace(/{FileName}/g, "/" + fileName);
if (validExtensions.indexOf(file) != -1) {
jquery("#dialog").html(image);
} else {
jquery("#dialog").html(object);
}
}
});
}
</script>