您的位置:首页 > 其它

关于Firefox、Safari 与IE区别实际应用的一点心得

2012-03-09 12:08 417 查看
最近接触到一个项目,功能也不是很复杂,刚开始是在IE下测试通过,后来客户用了一段时间,反馈说FireFox下某些功能用不了,后来又有客户反馈说 Safari也用不了,这就引发了我对这块某些特性的研究的兴趣,后来项目在这三个浏览器下都可以运行,总的来说,还是有点心得,和大家分享下。

1、关于上传的问题

一般情况下,我们会在需要上传的界面的Form中加这么一个东西(enctype="multipart/form-data"),如:

<form id="form1" runat="server" enctype="multipart/form-data">

enctype在Firefox和IE中,都是好的,不会有问题,但在Safari中,就会出大问题,加了这个后,页面的状态很有可能丢失掉,导致页面只要有回传或触发的时候,Page.IsPostBack = false,页面的功能将失效,所以,建议大家Form中最好不要加enctype="multipart/form-data"。

那这又引发了另外一个问题,既然enctype不能用,那么不是有可能不能完整的传递文件数据了吗?这里,我给大家推荐一个后台方法:

有些时候,我们在后台获取文件的时候喜欢用这个方法:

UploadFile uploadFile = new UploadFile(FilePath);

用这个方法的话,在Firefox和IE中也不会有问题,在Safari中,出问题了,uploadFile 等于null,所以,我给大家推荐的方法是,我们后台获取文件的时候用另外的下面的方法:

for (int i = 0; i < Request.Files.Count; i++)
{
if (Request.Files[i].ContentLength > 0)
{

}

}

Request.Files[i]就是获取到得文件,这个方法,在Firefox、Safari 、IE中都可以得到文件。

2、关于window.showModalDialog的问题

window.showModalDialog的功能是打开一个模态窗口,我们可以通过这个方法获取弹出界面的返回值,如:

var win = window.showModalDialog("test.aspx", window, "dialogWidth=500px;dialogHeight=150px;status=0;scroll=no");

但这个方法只是支持IE,Firefox完全不支持(Firefox中连界面都不会弹出),虽然目前Safari 中showModalDialog可以弹出界面,但返回值在父页面时获取不到,因此,尽量避免使用window.showModalDialog,如果实在万不得已要在Firefox中使用弹出窗口的话,我可以给朋友们提供一个解决方案,是用JavaScript写的一个模拟弹出界面的一个窗口,可以获取到返回值,鉴于代码有点多,需要的朋友可以留言给我,我可以发个demo过去。

3、关于innerText的问题

比如我界面上有个Label,如:

<asp:Label ID="labMessage" runat="server"></asp:Label>

一般我们在IE里面,如果想通过前台JavaScript给Label 的Text赋值的话,我们可以用如下方法:

var labMessage = document.getElementById("labMessage");

labMessage .innerText = "123";

但这种方法在Firefox下就不行了,Firefox虽然脚本不会报错,而且如果通过调试的话我们也可以发现labMessage .innerText 确实也是"123",但在界面上我们看到的labMessage的text却是空白,因此,在 Firefox下,我们要改用其它的方法,方法如下:

var labMessage = document.getElementById("labMessage");

labMessage .textContent= "123";

我们把innerText 换成了textContent,这样,在Firefox中,也可以用了。

我们还可以把方法改进下,使其兼容IE,和Firefox:

var labMessage = document.getElementById("labMessage");

if (navigator.appName.indexOf("Explorer") > -1)

{

labMessage.innerText = message;

}

else

{

labMessage.textContent = message;

}

这种方法,Safari中同样适用。

4、关于defaultbutton的问题

有时候,我们会给页面加一个默认按钮,只要每次按下enter键的时候,我们就触发这个按钮的事件,如:

<form id="form1" runat="server" defaultbutton="btnSave">

但这种方法也只有在IE中可以起到作用,Firefox、Safari 都不支持,因此,网上搜索了下,如下方案可以解决这个问题:

(1)、创建一个JS文件,如:DefaultButton.js;

(2)、打开DefaultButton.js,里面写入如下代码:

var __defaultFired = false;
function WebForm_FireDefaultButton(event, target) {
var element = event.target || event.srcElement;
if (!__defaultFired && event.keyCode == 13 && !(element && (element.tagName.toLowerCase() == "textarea"))) {
var defaultButton;
if (__nonMSDOMBrowser)
defaultButton = document.getElementById(target);
else defaultButton = document.all[target];
if (defaultButton) {
if (typeof (defaultButton.click) != "undefined")
defaultButton.click();
else
eval(unescape(defaultButton.href.replace("javascript:", "")));
event.cancelBubble = true;
if (event.stopPropagation)
event.stopPropagation();
return false;
}
}
return true;
}
(3)、在页面的PageLoad事件里注册DefaultButton.js里的脚本:
protected void Page_Load(object sender, EventArgs e)
{
ClientScript.RegisterClientScriptInclude("js1", "DefaultButton.js");

//自己的代码

...

...
}

上述步骤完成后

<form id="form1" runat="server" defaultbutton="btnSave">

此时,Firefox、Safari 对defaultbutton也支持。

www.aitaowang8.com

目前暂时就整理了上述几点,有时间再多整理点。

转自:http://blog.csdn.net/zhou331209/article/details/5053386
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: