|
iframe中获取file绝对路径问题，document.selection.createRange()为空
var obj = document.getElementById("file");
obj.select();
obj.blur();
var path = document.selection.createRange().text;
这段代码放在iframe中时，path获取的路径为空？这是为什么呢？
全部代码太多了，用ext写的，模拟个吧
主页面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<iframe frameborder='0' style='width:100%;height:100%;' src="a.html"> </iframe>
</body>
</html>
a.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<input type="file" id="file">
<input type="button" onclick="getUrl()">
</body>
</html>
<script type="text/javascript">
function getUrl()
{
var obj = document.getElementById("file");
obj.select();
obj.blur();
var path = document.selection.createRange().text;
alert(path);
}
</script>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="WebForm1.aspx.cs" Inherits="WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>WebForm1</title> </head> <body> <form id="form1" runat="server"> <div id="divbody"> <iframe src="WebForm2.aspx" id="ifram1" frameborder="0" ></iframe> </div> </form> </body> </html>
------------------------------------------------------------
WebForm2
XML/HTML code?<%@ Page Language="C#" AutoEventWireup="true" CodeFile="WebForm2.aspx.cs" Inherits="WebForm2" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>WebForm2</title> <script src="Scripts/jquery.min.js" type="text/javascript"></script> </head> <body> <form id="form1" runat="server"> <div id="divlayer"> <input type="file" id="file1" /> </div> </form> <script> var file = document.getElementById("file1"); file.onchange = function () { file.select(); var path = document.selection.createRange().text; alert(path); } </script> </body> </html>
在IE9下，document.selection.createRange()拒绝访问，看来安全性有所提高。
最后测试发现，在IE9下，如果file控件获得焦点，则document.selection.createRange()拒绝访问，
因此，只需要在fileImg.select()后面加一句fileImg.blur()即可。
但是，如果当前页面被嵌在框架中，则fileImg.blur()之后，file控件中原本被选中的文本将会失去选中的状态，因此，不能使用fileImg.blur()。
可以让当前页面上的其他元素，如div，button等获得焦点即可，如div_view.focus()。
注意，如果是div，则要确保div有至少1像素的高和宽，方可获得焦点。
目前在IE9中测试，一切正常。 可行
| 