跨瀏覽器登錄
㈠ js 實現一些跨瀏覽器的事件方法詳解及實例
js實現一些跨瀏覽器的事件方法
用javaScript實現事件的綁定，移除，以及一些常用的事件屬性的獲取，時常要考慮到在不同瀏覽器下的兼容性，下面給出了一個跨瀏覽器的事件對象：
var
EventUtil
=
{
on:
function(element,
type,
handler)
{/*
添加事件
*/
if
(element.addEventListener)
{
element.addEventListener(type,
handler,
false);
}
else
if
(element.attachEvent)
{//IE
注意：此時事件處理程序會在全局作用域中運行，因此用attachEvent綁定的事件，此時在事件處理函數里的this
等於window，使用時要注意
element.attachEvent("on"
+
type,
handler);
}
else
{
element["on"
+
type]
=
handler;
}
},
off:
function(element,
type,
handler)
{/*
移除事件
*/
if
(element.removeEventListener)
{
element.removeEventListener(type,
handler,
false);
}
else
if
(element.detachEvent)
{
element.detachEvent("on"
+
type,
handler);
}
else
{
element["on"
+
type]
=
null;
}
},
getEvent:
function(event)
{/*
返回對event對象的引用
*/
return
event
?
event
:
window.event;
},
getTarget:
function(event)
{/*
返回事件的目標
*/
return
event.target
||
event.srcElement;
},
preventDefault:
function(event)
{
/*
取消事件的默認行為
*/
if
(event.preventDefault)
{
event.preventDefault();
}
else
{
event.returnValue
=
false;
}
},
stopPropagation:
function(event)
{/*
阻止事件冒泡
*/
if
(event.stopPropagation)
{
event.stopPropagation();
}
else
{
event.cancelBubble
=
true;
}
},
/*
mouseover
和mouserout
這兩個事件都會涉及把滑鼠指針從一個元素的邊界之內移動到另一個元素的邊界之內。*/
getRelatedTarget:
function(event)
{
if
(event.relatedTarget)
{
return
event.relatedTarget;
}
else
if
(event.toElement)
{//IE8
mouserout事件
return
event.toElement;
}
else
if
(event.fromElement)
{//IE8
mouseover事件
return
event.fromElement;
}
else
{
return
null;//其他事件
}
}
};
調用如下：
EventUtil.on(document,
"click",
function(event){//為document元素綁定click事件
event
=
EventUtil.getEvent(event);//獲取event事件對象
alert("Screen
coordinates:
"
+
event.screenX
+
","
+
event.screenY);
});
文章參考自《JavaScript高級程序設計第三版》
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
㈡ javascript 什麼叫跨瀏覽器事件處理
一.關於獲取事件對象
FF有點倔強，只支持arguments[0]，不支持window.event。這次真的不怪IE，雖然把event作為window的屬性不合規范，但大家都已經默許這個小問題存在了，只有FF這么多年了還是特立獨行。所以，跨瀏覽器的事件對象獲取有以下兩種方式：
帶參的：
?
1
2
3
4
getEvent : function(event){
return event ? event : window.event;
//return event || window.event;//或者更簡單的方式
}
無參的：
?
1
2
3
4
function getEvent() {
return arguments[0] ? arguments[0] : window.event;
//return arguments[0] || window.event;//或者更簡單的方式
}
需要特別說明一種方式：html的DOM0級方式 + 帶參的事件處理器，如下：
?
1
2
3
4
function handler(event){
//do something
}
<!-- HTML的DOM0級方式 --><br><button id="btn" onclick="handler(event);">按鈕</button><br>
上面這種方式是全瀏覽器兼容的，但依賴HTML的DOM0級方式的缺點很明顯，所以沒能成為像前兩種那樣的主流方法，而JS的DOM0級方式 + 帶參的事件處理器，如下：
?
1
2
3
4
5
function handler(event){
//do something
}
btn.onclick = handler;//JS的DOM0級方式
//btn.onclick = function(event){/*do something*/}//或者匿名函數，效果同上
這種方式不是全瀏覽器兼容的，[IE8-]不支持，IE9+未知，FF，Chrome支持。一直以為HTML的DOM0級事件處理和JS的DOM0級事件處理是等價的，現在做了很多實驗才發現二者是有區別的
二.關於獲取事件源
event.srcElement是[IE8-]唯一的方式，IE9+未知，其它瀏覽器都支持標準的event.target方式
三.關於阻止事件默認行為
event.preventDefault()是標准方法，但[IE8-]不支持，IE自己的方式是event.returnValue = false;
四.關於停止事件傳播
event.stopPropagation()是標准方法，IE又有意見了，他要這么玩：event.cancelBubble = true;這里需要特別注意了，因為cancel是屬性而不是方法，與標准相差甚遠，容易記錯
五.關於事件處理器的添加和移除
DOM0級方式
ele.onclick = handler;ele.onclick=null;最古老的一種方式
優點：全瀏覽器兼容
缺點：同一事件只能綁定/解綁一個事件處理器
DOM2級方式
?
1
ele.add/removeEventListener(eventType, handler, catch);
和IE方式：ele.attach/detachEvent(『on'+eventType, handler);
優點：支持綁定/解綁多個事件處理器
缺點：需要做兼容性判斷。需要注意的是：標准方式中最後一個參數表示是否在事件捕獲階段綁定/解綁，IE不支持事件捕獲，所以也就沒有第三個參數了
注意：IE方式不僅方法名與標准不同，參數中事件類型還要加上on，否則綁定無效但不報錯
六.跨瀏覽器的事件處理
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
//跨瀏覽器的事件處理器添加方式
var EventUtil = {
addHandler : function(elem, type, handler){
if(elem.addEventListener){
elem.addEventListener(type, handler, false);
}
else if(elem.attachEvent){
elem.attachEvent("on" + type, handler);//添加多個同一類型的handler時，IE方式的規則是最後添加的最先觸發
}
else{
if(typeof elem["on" + type] === 'function'){
var oldHandler = elem["on" + type];
elem["on" + type] = function(){
oldHandler();
handler();
}
}
else{
elem["on" + type] = handler;//支持添加多個事件處理器
}
}
},
getEvent : function(event){
return event ? event : window.event;
},
getTarget : function(event){
return event.target || event.srcElement;
},
preventDefault : function(event){
if(event.preventDefault){
event.preventDefault();
}
else{
event.returnValue = false;
}
},
removeHandler : function(elem, type, handler){
if(elem.removeEventListener){
elem.removeEventListener(type, handler, false);
}
else if(elem.detachEvent){
elem.detachEvent("on" + type, handler);
}
else{
elem["on" + type] = null;//不支持移除單一事件處理器，只能全部移除
}
},
stopPropagation : function(event){
if(event.stopPropagation){
event.stopPropagation();
}
else{
event.cancelBubble = true;
}
},
getRelatedTarget : function(event){
if(event.relatedTarget){
return event.relatedTarget;
}
else if(event.toElement && event.type == "mouseout"){
return event.toElement;
}
else if(event.fromElement && event.type == "mouseover"){
return event.fromElement;
}
else{
return null;
}
},
/*IE8點擊左鍵和中鍵都是0；FF無法識別中鍵；Chrome正常*/
getButton : function(event){//返回0，1，2 - 左，中，右
if(document.implementation.hasFeature("MouseEvents", "2.0")){
return event.button;
}
else{
switch(event.button){
case 0:case 1:case 3:case 5:case 7:
return 0;
break;
case 2:case 6:
return 2;
break;
case 4:
return 1;
break;
default:
break;
}
}
},
/*只能檢測keypress事件，返回值等於將要顯示的字元編碼*/
/*IE和Chrome只有能顯示的字元鍵才觸發，FF其它鍵也能觸發，返回值為0*/
getCharCode : function(event){
if(typeof event.charCode == "number"){
return event.charCode;
}
else{
return event.keyCode;
}
}
};
綜合示例
如果項目中沒有使用諸如 jQuery 之類的庫，如何方便地為元素綁定事件，並兼容各種瀏覽器呢？下面這個簡單的 Utility 應該可以考慮。
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
var eventUtility = {
addEvent : function(el, type, fn) {
if(typeof addEventListener !== "undefined") {
el.addEventListener(type, fn, false);
} else if(typeof attachEvent !== "undefined") {
el.attachEvent("on" + type, fn);
} else {
el["on" + type] = fn;
}
},
removeEvent : function(el, type, fn) {
if(typeof removeEventListener !== "undefined") {
el.removeEventListener(type, fn, false);
} else if(typeof detachEvent !== "undefined") {
el.detachEvent("on" + type, fn);
} else {
el["on" + type] = null;
}
},
getTarget : function(event) {
if(typeof event.target !== "undefined") {
return event.target;
} else {
return event.srcElement;
}
},
preventDefault : function(event) {
if(typeof event.preventDefault !== "undefined") {
event.preventDefault();
} else {
event.returnValue = false;
}
}
};
使用方法示例：
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var eventHandler = function(evt) {
var target = eventUtility.getTarget(evt),
tagName = target.tagName;
if(evt.type === "click") {
if(tagName === "A" || tagName === "BUTTON") {
alert("You clicked on an A element, and the innerHTML is " + target.innerHTML + "!");
eventUtility.preventDefault(evt);
}
} else if(evt.type === "mouseover" && tagName === "A") {
alert("mouseovered " + target.innerHTML);
}
};
eventUtility.addEvent(document, "click", eventHandler);
eventUtility.addEvent(document, "mouseover", eventHandler);
eventUtility.removeEvent(document, "mouseover", eventHandler);
㈢ 有沒有瀏覽器直接可以跨越的那種
目前沒有能直接跨越的瀏覽器，都是藉助第三方插件才能實現的。
㈣ 如何解決跨瀏覽器的問題
你好，你可以使用360瀏覽器，它界面上的有跨屏瀏覽的按鈕，點就可以跨屏瀏覽。
㈤ 跨平台、跨瀏覽器分別是什麼意思
跨平台概念是軟體開發中一個重要的概念，即不依賴於操作系統，也不依賴硬體環境。通俗的說就是一款軟體可以在Windows、Mac OS、Liniux、Android等環境下運行。
跨瀏覽器指的是某項服務可以應用於多個瀏覽器。通俗的說就是某個網頁能在Chrome、Firefox、Safari、Internet Explorer中正常打開。（某項擴展提供了Chrome、Firefox、Internet Explorer的版本也可以成為跨瀏覽器）
㈥ 怎麼 才能禁止跨瀏覽器 cookie 共享
IE 8在默認情況下,會話都是一樣的。
解決方法有兩個：
在IE 8中，假設你沒有打開菜單欄，請按下鍵盤上的Alt鍵打開菜單欄，然後依次選擇「文件-新建會話」，這樣IE會自動打開一個新窗口，但該窗口所在會話和原窗口所在會話是完全隔離的，無法共用會話Cookie，因此可以按照需要放心打開多個會話，並使用不同的馬甲登錄。
如果覺得麻煩，或者有其他原因，也可以創建一個帶有特殊參數的快捷方式：「iexplore.exe -nomerge」，使用該參數打開的IE窗口也將使用獨立的一套會話Cookie。
實在不行就得要求用戶在需要的時候用新建會話的方式實現。
㈦ 在跨瀏覽器上，B/S結構不盡如人意。什麼意思呢
主要是瀏覽器對html代碼的解釋效果不一致，在IE6的年代跨瀏覽器讓網頁開發人員很頭疼
㈧ 熟悉JAVASCRIPT和CSS跨瀏覽器方面的技巧。 請問 跨瀏覽器是什麼意思
就是說在多種內核和不同版本的瀏覽器中，你的JAVASCRIPT代碼都要能夠正確運行，而內CSS則要使頁面在各種瀏容覽器中均能呈現相同的（至少也要差不多的）外觀呈現。如果達到了這樣的要求，就說明你設計的網頁可以跨瀏覽器運行了。這里說的瀏覽器包括IE、FireFox、Chrome、Opera等等，而IE又分IE6、IE7、IE8、IE9等，此外還有手機瀏覽器，很多。
㈨ ntko office怎麼跨瀏覽器
NTKO OFFICE文檔控制項是由重慶軟航科技有限公司開發的，能夠在IE、Chrome、Firefox等多個瀏覽器中編輯S Office、WPS文字、WPS電子表、永中Office、中標普華Office、Open office等文檔並保持到WEB伺服器的在線編輯控制項，該產品完美的實現了文檔和電子表格的統一管理。
本文為了廣大企業用戶能更好的了解該產品，做好信息化管理軟體選型，巔峰網評測人員特意體驗了該產品，與大家分享其特色功能。
NTKO OFFICE文檔控制項 六大特色功能
NTKO OFFICE文檔控制項應用示例如下：
1、二維碼功能
二維碼功能有公文二維條碼、自定義二維碼、一維碼。通過文檔控制項提供的函數，調用各種條碼的功能，在當前打開的Word，Excel，WPS文字中插入國家公文標準的PDF417條碼，自定義內容的PDF417條碼，以及QrCode二維條碼。並且支持ENA13，CODE39，CODE128等一維條形碼。
不僅如此，文檔控制項還集成了國家公文標準的PDF417二維條碼UI界面,通過方法調用,直接啟用界面,讓用戶在界面中輸入各項參數，預覽並生成pdf417二維碼。產生的條碼列印之後，可以直接用硬體（條碼掃描槍），識別條碼的內容。
2、PDF閱讀功能：
該功能使得文檔控制項可以使用OpenFromURL,或者BeginOpenFromURL方法，從本地/伺服器打開PDF文檔進行閱讀。並可以控制禁止保存，列印等。或者可以從本地打開PDF文檔並保存到伺服器。
3、TIF閱讀功能
隨著電子傳真格式的進一步應用，很多企業接收的傳真是TIF格式的文件。此功能使得文檔控制項可以使用OpenFromURL,或者BeginOpenFromURL方法，從本地/伺服器打開TIF文檔進行閱讀。並可以控制禁止保存，列印等。或者可以從本地打開TIF/TIFF文檔並保存到伺服器。開發商只需要調用文檔控制項的介面也就可以實現TIF的功能。
4、永中OFFICE在線編輯功能
文檔控制項永中OFFICE版增加了文檔控制項對永中OFFICE基本功能的支持。包括從本地/伺服器打開文檔，保存文檔到本地/伺服器，以及基本的痕跡保留等功能支持。
5、CAD在線編輯功能
文檔控制項CAD版增加了文檔控制項對CAD基本功能的支持。包括從本地/伺服器打開文檔，保存文檔到本地/伺服器。
6、中標普華office /Open office在線編輯功能
文檔控制項中標普華office版增加了文檔控制項對中標普華office基本功能的支持。包括從本地/伺服器打開文檔，保存文檔到本地/伺服器，以及基本的痕跡保留、智能提交等功能支持，同時支持Open office。
NTKO OFFICE文檔控制項產品優勢簡述
1)產品性能穩定，可擴展性強，功能強大；目前國內絕大部分大型開發商都是集成的我們的文檔控制項，已擁有上萬的最終用戶群；
2)採用標準的HTTP協議，後台無需安裝任何組件，可以支持所有的web伺服器及所有的web編程語言；開發簡單、兼容性好，對未來只要是採用標准協議的伺服器都能支持；
3)採用智能提交技術，可在提交控制項數據的同時，提交開發者指定的表單(FORM)數據。避免2次提交，簡化開發步驟；
4)在瀏覽器窗口中直接編輯Word、 Excel、wps、永中Office、中標普華Office、Open office等並保存到Web伺服器，實現文檔和電子表格的統一管理；
5)支持跨瀏覽器的在線編輯控制項；
6)一個版本同時支持MS office和金山WPS在線編輯，並支持多種文檔在線閱讀： PDF文檔閱讀、TIF文檔閱讀等；
7)支持自定義菜單、自定義按鈕、自定義工具欄，進一步增強了系統的可集成性；
8)Visio文檔、PDF及TIF閱讀；
9)BS版本的控制項,一個版本支持不同的開發語言。只要購買一個版本，就可以用於多種WEB開發平台（通用WEB版本也可以支持PB、VC開發，針對要求相對較高的客戶，建議採用PB、VC單獨版本）。
10)同一版本同時支持OFFICE03、07、10等的在線編輯；
11)產品授權與伺服器的數量無關
12)無縫集成NTKO 電子印章系統，支持電子印章、手寫簽名、鍵盤批註等，以及實現在各種文檔中加蓋安全簽章的解決方案；
13)擁有終身免費的、完善的售前和售後遠程技術支持服務，為客戶解決集成時的後顧之憂。
㈩ Struts2怎樣防止多個用戶跨瀏覽器登錄
每當一個用戶嘗試登陸時，首先驗證一下用戶名，密碼，然後對一個表欄位查詢驗證，此欄位用於判斷用戶是否已經登陸！可以設置為數字類型！用於控制同時在線個數！