2011年6月28日 星期二

網頁輸入頁面Enter鍵處理元件(KeyDownProcess Version:1.4)

function KeyDownProcess(e) {
//-----------------------------------------------------------
//網頁親和性輸入控制元件
//元件功能:可以讓網頁資料的輸入更親切,功能如下:
//1.按下Enter鍵自動找到下一個可輸入輸入元件
//2.按下Enter鍵自動找尋submit按鍵,如果找到則模擬Click的功能
//3.當輸入元件設定唯讀時,按下backspace鍵時,防止網頁轉址
//4.支援無障礙導覽設定
//5.支援Firefox、Google Chrome瀏覽器
//版本:1.4(2011.06.28)
//作者:科碩資訊有限公司
//引用本元件,請保留作者和版本資訊
//連絡mail:cursor@cursorinfo.com.tw
//------------------------------------------------------------
var kv = 0;
var rv = false;
var isTextarea = false;
var currentId = null; //目前元件
var ex;
var isAll = typeof (document.all) == "object";
if (isAll) {
ex = event;
kv = ex.keyCode;
isTextarea = (ex.srcElement.tagName == "TEXTAREA");
currentId = ex.srcElement.id;
}
else {
ex = e;
kv = ex.which * 1;
isTextarea = (ex.target == "[object HTMLTextAreaElement]");
currentId = ex.target.id;
}
switch (kv) {
case 8:
if (currentId.length == 0)
return false;
return !document.getElementById(currentId).readOnly;
case 13:
if (isAll) {
if (ex.srcElement.tagName == "A" || (ex.srcElement.tagName == "INPUT" && ex.srcElement.type == "BUTTON"))
return true;
}
if (currentId.length == 0)
return false;
if (isTextarea == true) {
rv = isTextarea;
}
else {
var cts = isAll ? document.all : document.getElementsByTagName('*');
var cid = "";
var queryBu = null;
var beginNext = false; //開始比對是否為輸入元件
var nextInput = null; //下一個輸入元件
var specialSubmitId = "textQueryBU"; //指定特例的submit id
var exceptionSubmitId = "waitting"; //指定例外的submit Id
for (ii = 0; ii < cts.length; ii++) {
if (cts[ii].type == null || cts[ii].id == null)
continue;

if (cts[ii].id == currentId) {
beginNext = true;
continue;
}
if (beginNext == true && (cts[ii].id.indexOf(specialSubmitId) > -1 || ((cts[ii].type == "submit" || cts[ii].type == "image") && cts[ii].id.indexOf(exceptionSubmitId) == -1))) {
queryBu = cts[ii]; //找到submit元件
break;
}
else if (beginNext == true && (cts[ii].type == "text" || cts[ii].type == "textarea" || cts[ii].type == "password") && cts[ii].readOnly == false && cts[ii].style.display != "none") {
nextInput = cts[ii]; //找到下一個文字輸入元件
break;
}
}
if (null != queryBu) {
setTimeout("doClickId('" + queryBu.id + "');", 100);
rv = false;
}
else if (null != nextInput) {
try {
nextInput.focus();
} catch (Error) { return true; }
rv = false;
}
}
break;
default:
rv = true;
break;
}
return rv;
}
//實做模擬Click的功能
function doClickId(source) {
var o = document.getElementById(source);
if (document.all && typeof (document.all) == "object") //IE
o.click();
else {
var e = document.createEvent('mouseEvent');
e.initEvent('click', true, true);
o.dispatchEvent(e);
}
}

2011年6月27日 星期一

網頁輸入頁面Enter鍵處理元件(KeyDownProcess Version:1.3)

function KeyDownProcess() {
//-----------------------------------------------------------
//網頁親和性輸入控制元件
//元件功能:可以讓網頁資料的輸入更親切,功能如下:
//1.按下Enter鍵自動找到下一個可輸入輸入元件
//2.按下Enter鍵自動找尋submit按鍵,如果找到則模擬Click的功能
//3.當輸入元件設定唯讀時,按下backspace鍵時,防止網頁轉址
//4.支援無障礙導覽設定
//版本:1.3(2010.09.12)
//作者:科碩資訊有限公司
//引用本元件,請保留作者和版本資訊
//連絡mail:cursor@cursorinfo.com.tw
//------------------------------------------------------------
var kv = 0;
var rv = false;
var isTextarea = false;
var currentId = null; //目前元件
if (document.all && typeof (document.all) == "object") {
kv = event.keyCode;
isTextarea = (event.srcElement.tagName == "TEXTAREA");
currentId = event.srcElement.id;
}
else {
kv = evt.keyCode;
isTextarea = (evt.target == "TEXTAREA");
currentId = evt.id;
}
switch (kv) {
case 8:
if (currentId.length == 0)
return false;
return !document.getElementById(currentId).readOnly;
case 13:
if (event.srcElement.tagName == "A" || (event.srcElement.tagName == "INPUT" && event.srcElement.type == "BUTTON"))
return true;

if (currentId.length == 0)
return false;
if (isTextarea == true) {
rv = isTextarea;
}
else {
var cts = document.all && typeof (document.all) == "object" ? document.all : document.getElementsByTagName('input');
var cid = "";
var queryBu = null;
var beginNext = false; //開始比對是否為輸入元件
var nextInput = null; //下一個輸入元件
var specialSubmitId = "textQueryBU"; //指定特例的submit id
var exceptionSubmitId = "waitting"; //指定例外的submit Id
for (ii = 0; ii < cts.length; ii++) {
if (cts[ii].id == currentId) {
beginNext = true;
continue;
}
if (beginNext == true && (cts[ii].id.indexOf(specialSubmitId) > -1 || ((cts[ii].type == "submit" || cts[ii].type == "image") && cts[ii].id.indexOf(exceptionSubmitId) == -1))) {
queryBu = cts[ii]; //找到submit元件
break;
}
else if (beginNext == true && (cts[ii].type == "text" || cts[ii].type == "textarea" || cts[ii].type == "password") && cts[ii].readOnly == false && cts[ii].style.display != "none") {
nextInput = cts[ii]; //找到下一個文字輸入元件
break;
}
}
if (null != queryBu) {
setTimeout("doClickId('" + queryBu.id + "');", 100);
rv = false;
}
else if (null != nextInput) {
try {
nextInput.focus();
} catch (Error) { return true; }
rv = false;
}
}
break;
default:
rv = true;
break;
}
return rv;
}
//實做模擬Click的功能
function doClickId(source) {
var o = document.getElementById(source);
if (document.all && typeof (document.all) == "object") //IE
o.click();
else {
var e = document.createEvent('mouseEvent');
e.initEvent('click', true, true);
o.dispatchEvent(e);
}
}

使用Javascript處理網頁Cookie心得

一、問題說明
在網頁運作過程有時候會使用Client Cookie的技術處理一些個別化的資訊,當我們使用搜尋引擎去搜尋Javascript處理Cookie的技術文章時,可以得到非常多樣的版本,但這些程式碼面對同時需要在主流瀏覽器如IE、Firefox、Chrome會有適用上的問題。

二、蒐集與改作
為了讓處理Cookie的Javascript的程式碼能同時適用於IE、Firefox、Chrome,經個人蒐集、測試、改寫後,彙整成下面程式碼,發布給有此需求的網友使用,並請繼續改良提供修正意見。

三、程式碼
function GetCookieValue(c_name) {
var cookieValue = null;
var search = c_name + "=";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search);
if (offset != -1) {
offset += search.length;
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
cookieValue = unescape(document.cookie.substring(offset, end))
}
}
return cookieValue;
}
function DeleteCookie(c_name) {
var expiredays = 20;
var exdate = new Date()
exdate.setDate(exdate.getDate() - expiredays)
document.cookie = c_name + "=" + escape(0) + ";path=/" + ";domain=" + location.host + ((expiredays == null) ? "" : ";expires=" + exdate.toUTCString());
}
function SetCookieValue(c_name, value) {
var expiredays = 20;
var exdate = new Date()
exdate.setDate(exdate.getDate() + expiredays)
document.cookie = c_name + "=" + escape(value) + ";path=/" + ";domain=" + location.host + ((expiredays == null) ? "" : ";expires=" + exdate.toUTCString());
}
四、重點說明:
 1、GetCookieVaue有多種解法,此版本可以同時適用於各主流瀏覽器。
 2、SetCookieValue修改重點是:除了name value expires外一定要加入domain和path的value。