» 專業技術 - Hero Think~用手摀住我的嘴

jQuery ajax使用在JAVA注意事項 – 編碼問題

2009年1月18日 hero 2 則評論

今天花了一些時間在排除一個怪現象
因為覺得很奇特，所以特別寫上註記一下
給自己加深印象，也給可能會遇到的人參考一下

就是今天在撰寫程式利用jQuery的ajax 向另一隻程式要資料
寫法都沒有問題，但就是會出現ajax Error

初步排除法:
1.先確認程式是否無誤
2.再確認編碼是否為utf8
3.再確認回傳參數是否符合格式 (今天是使用json)

都確認過了，但就還是失敗
所以先把資料頁存成htm的方式試試
怪了，竟然成功了說 =.=|||

再仔細確認剛剛檢查的步驟，每一項都正確但只要換成JSP
就會失敗…最後發現問題點在

<%@ page contentType=”text/html; charset=UTF8″ %>

要調整為以下才行

<%@ page contentType=”text/html; charset=UTF-8” %>

怪吧! 瀏覽器兩者都認為是UTF-8的格式，但jQuery似乎比較挑一點
一定要寫UTF-8才行..@@ (又不知死了多少腦細胞了..)

Categories: JAVA Tags: Java, jquery

jQuery 小技巧 – 在非UTF8語系網頁傳遞中文參數排除方式

2009年1月14日 hero 尚無評論

jQuery 在UTF8語系網頁傳遞中文時是一切正常的

但如果是big5語系時就會發生問題，因此要進行轉碼才能正常傳遞參數才行
在網頁用ajax傳遞時，要先將資料利用javascript的escape function進行轉碼

例如:

$(document).ready(function(){
$.post(
   “getdata.asp”,
   {
   id:
escape(“中文字喔!!”)
   },
   function(txt){
alert(txt);

   }
);
});

以下是PHP版的解escape的函式:

以下是Java版本解escape的函式:

/**
* JavaScript escape/unescape 編碼的Java實現
* author jackyz keep this copyright info while using this method by free
*/
public class JavaScriptEscape {
   private final static String[] hex = { “00”, “01”, “02”, “03”, “04”, “05”,
   “06”, “07”, “08”, “09”, “0A”, “0B”, “0C”, “0D”, “0E”, “0F”, “10”,
   “11”, “12”, “13”, “14”, “15”, “16”, “17”, “18”, “19”, “1A”, “1B”,
   “1C”, “1D”, “1E”, “1F”, “20”, “21”, “22”, “23”, “24”, “25”, “26”,
   “27”, “28”, “29”, “2A”, “2B”, “2C”, “2D”, “2E”, “2F”, “30”, “31”,
   “32”, “33”, “34”, “35”, “36”, “37”, “38”, “39”, “3A”, “3B”, “3C”,
   “3D”, “3E”, “3F”, “40”, “41”, “42”, “43”, “44”, “45”, “46”, “47”,
   “48”, “49”, “4A”, “4B”, “4C”, “4D”, “4E”, “4F”, “50”, “51”, “52”,
   “53”, “54”, “55”, “56”, “57”, “58”, “59”, “5A”, “5B”, “5C”, “5D”,
   “5E”, “5F”, “60”, “61”, “62”, “63”, “64”, “65”, “66”, “67”, “68”,
   “69”, “6A”, “6B”, “6C”, “6D”, “6E”, “6F”, “70”, “71”, “72”, “73”,
   “74”, “75”, “76”, “77”, “78”, “79”, “7A”, “7B”, “7C”, “7D”, “7E”,
   “7F”, “80”, “81”, “82”, “83”, “84”, “85”, “86”, “87”, “88”, “89”,
   “8A”, “8B”, “8C”, “8D”, “8E”, “8F”, “90”, “91”, “92”, “93”, “94”,
   “95”, “96”, “97”, “98”, “99”, “9A”, “9B”, “9C”, “9D”, “9E”, “9F”,
   “A0”, “A1”, “A2”, “A3”, “A4”, “A5”, “A6”, “A7”, “A8”, “A9”, “AA”,
   “AB”, “AC”, “AD”, “AE”, “AF”, “B0”, “B1”, “B2”, “B3”, “B4”, “B5”,
   “B6”, “B7”, “B8”, “B9”, “BA”, “BB”, “BC”, “BD”, “BE”, “BF”, “C0”,
   “C1”, “C2”, “C3”, “C4”, “C5”, “C6”, “C7”, “C8”, “C9”, “CA”, “CB”,
   “CC”, “CD”, “CE”, “CF”, “D0”, “D1”, “D2”, “D3”, “D4”, “D5”, “D6”,
   “D7”, “D8”, “D9”, “DA”, “DB”, “DC”, “DD”, “DE”, “DF”, “E0”, “E1”,
   “E2”, “E3”, “E4”, “E5”, “E6”, “E7”, “E8”, “E9”, “EA”, “EB”, “EC”,
   “ED”, “EE”, “EF”, “F0”, “F1”, “F2”, “F3”, “F4”, “F5”, “F6”, “F7”,
   “F8”, “F9”, “FA”, “FB”, “FC”, “FD”, “FE”, “FF” };

   private final static byte[] val = { 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x00, 0x01,
   0x02, 0x03, 0x04, 0x05, 0x06, 0x07, 0x08, 0x09, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x0A, 0x0B, 0x0C, 0x0D, 0x0E, 0x0F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x0A, 0x0B, 0x0C, 0x0D, 0x0E, 0x0F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F,
   0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F, 0x3F };

   /**
* 編碼
*
* @param s
* @return
*/
   public static String escape(String s) {
   StringBuffer sbuf = new StringBuffer();
   int len = s.length();
   for (int i = 0; i < len; i++) {
   int ch = s.charAt(i);
   if ('A' <= ch && ch <= 'Z') {
   sbuf.append((char) ch);
   } else if ('a' <= ch && ch <= 'z') {
   sbuf.append((char) ch);
   } else if ('0' <= ch && ch <= '9') {
   sbuf.append((char) ch);
   } else if (ch == '-' || ch == '_' || ch == '.' || ch == '!'
   || ch == '~' || ch == '*' || ch == '\'' || ch == '('
   || ch == ')') {
   sbuf.append((char) ch);
   } else if (ch <= 0x007F) {
   sbuf.append('%');
   sbuf.append(hex[ch]);
   } else {
   sbuf.append('%');
   sbuf.append('u');
   sbuf.append(hex[(ch >>> 8)]);
   sbuf.append(hex[(0x00FF & ch)]);
   }
   }
   return sbuf.toString();
   }

   /**
* 解碼說明：本方法保證不論參數s是否經過escape()編碼，均能得到正確的「解碼」結果
*
* @param s
* @return
*/
   public static String unescape(String s) {
   StringBuffer sbuf = new StringBuffer();
   int i = 0;
   int len = s.length();
   while (i < len) {
   int ch = s.charAt(i);
   if ('A' <= ch && ch <= 'Z') {
   sbuf.append((char) ch);
   } else if ('a' <= ch && ch <= 'z') {
   sbuf.append((char) ch);
   } else if ('0' <= ch && ch <= '9') {
   sbuf.append((char) ch);
   } else if (ch == '-' || ch == '_' || ch == '.' || ch == '!'
   || ch == '~' || ch == '*' || ch == '\'' || ch == '('
   || ch == ')') {
   sbuf.append((char) ch);
   } else if (ch == '%') {
   int cint = 0;
   if ('u' != s.charAt(i + 1)) {
   cint = (cint << 4) | val[s.charAt(i + 1)];
   cint = (cint << 4) | val[s.charAt(i + 2)];
   i += 2;
   } else {
   cint = (cint << 4) | val[s.charAt(i + 2)];
   cint = (cint << 4) | val[s.charAt(i + 3)];
   cint = (cint << 4) | val[s.charAt(i + 4)];
   cint = (cint << 4) | val[s.charAt(i + 5)];
   i += 5;
   }
   sbuf.append((char) cint);
   } else {
   sbuf.append((char) ch);
   }
   i++;
   }
   return sbuf.toString();
   }

   public static void main(String[] args) {
   String stest = “中文1234abcd”;
   System.out.println(stest);
   System.out.println(escape(stest));
   System.out.println(unescape(escape(stest)));
   }

}

參考資料:
http://zhanghaidang.javaeye.com/blog/150470
http://blog.csdn.net/mubingyun/archive/2008/12/09/3482219.aspx
http://skiyo.cn/article/Skiyo-38-1223063418.html

Categories: Java Script Tags: Java, jquery, php

jQuery 學習筆記(二) – Form 欄位應用

2009年1月9日 hero 3 則評論

學習jQuery，剛開始還不太習慣，語法很像javascript(呵~他本來就算在其中)，但又不能直接拿來當物件用，真是麻煩呀~~，所以使用jQuery，最好基礎打好一點，不然可能會花費很多時間在查文件或TRY TRY 是否可行。

用Javascript ，以前最常就是在驗證欄位，雖然現在用了jQuery搞不好會變成一些傳遞參數還是畫面特效的
不過驗證欄位還是基本必須的啦，所以找到不錯的文章在提到jQuery取form裡的相關欄位的方式為何:

獲取一組radio被選中項的值
var item =
$('input[@name=items][@checked]').val();
獲取select被選中項的文本
var item =
$(“select[@name=items]
option[@selected]”).text();
select下拉框的第二個元素為當前選中值
$('#select_id')[0].selectedIndex
= 1;
radio單選組的第二個元素為當前選中值
$('input[@name=items]').get(1).checked =
true;

獲取值：

文本框，文本區域：$(“#txt”).attr(“value”)；
多選框checkbox：$(“#checkbox_id”).attr(“value”)；
單選組radio：
$(“input[@type=radio][@checked]”).val();
下拉框select： $('#sel').val();

控制表單元素：
文本框，文本區域：$(“#txt”).attr(“value”,'');//清空內容

$(“#txt”).attr(“value”,'11');//填充內容

多選框checkbox： $(“#chk1”).attr(“checked”,'');//不打勾

$(“#chk2”).attr(“checked”,true);//打勾

if($(“#chk1”).attr('checked')==undefined) //判斷是否已經打勾

單選組radio：
$(“input[@type=radio]”).attr(“checked”,'2');//設置value=2的項目為當前選中項
下拉框select：
$(“#sel”).attr(“value”,'-sel3');//設置value=-sel3的項目為當前選中項

$(“<option value='1'>1111</option><option
value='2'>2222</option>”).appendTo(“#sel”)//添加下拉框的option

$(“#sel”).empty()；//清空下拉框

感覺複雜多了，有空再來精簡一下。

參考資料:
http://www.cnblogs.com/xlfj521/archive/2008/01/29/1057375.html

Categories: Java Script Tags: jquery

好用的Flash Mp3 Player（可用javascript控制喔)

2009年1月7日 hero 尚無評論

最近剛好要找一個Flash Mp3 Player，剛好看到niftyplayer，還不錯用
特別來介紹一下。

他的官方網站如下
http://www.varal.org/media/niftyplayer/

目前最新版本到1.7，看來蠻陽春的，沒關係，因為我是想要隱藏播放器的
會選這套的重點是，就是看上他可以用javascript控制

因為只想做個Music On/Of的開關就好，簡單一點，不用播放器那麼佔空間
他官網介紹的很詳細，蠻容易使用的，所以不多說什麼啦，接下來只介紹在網頁上如何加上Music On /Off

先將flash及javascript放在你的網站，然後在你的網頁加上以下html語法:

Music
<span id=”m1″ style=”display:none”><a href=”javascript:music_play();” class=”style7″>On</a></span>
<span id=”m2″ style=”display:”><a href=”javascript:music_pause();” class=”style7″>Off</a><span>

然後在<head></head>之間加上javascript語法:

function music_play() {
niftyplayer('niftyPlayer1').play();
m1.style.display=”none”;
m2.style.display=””;
}
</script>

當然還有一個我就不說啦就是要把flash語法崁上去並設name為niftyPlayer1 (sample的語法貼上即可)，如要隱藏就在height 及width 都設定為0就可以啦

這樣，你的網頁就有音樂播放功能啦

Categories: WebDesign Tags: flash player

JSON 解析與運用 for PHP

2009年1月6日 hero 尚無評論

JSON格式在Javascript裡算是標準的資料格式，但在其它語言就不算是了，所以各家server端的程式語言就要去解析來配合了，目前剛好會先用PHP進行與jquery的測試，所以先對PHP對JSON解析進行瞭解。

目前PHP在5.2版之後已經有內建支援JSON的轉換函式，看來也是因為ajax當道，所以php 直接內建了..^^
在5.2版的PHP 可以使用 json_encode及json_decode 進行轉換成PHP物件陣列，用法如下:

//PHP
$test=array(
“x” => 1,
“y” => 2,
“str” => “test string”,
“a” => array (
“array value 1”,
“array value 2”,
3
}
);

$jsonstr = json_encode($test);
$jsonstr內容則為
{
“x”:1,
“y”:2,
“str”:”test string”,
“a”:[
“array value 1”,
“array value 2”,
3
]
}

目前json_encode對中文字只能用utf8，要特別注意這點。最後取回時在Javascript 執行eval()即可使用了

var test= eval(“(“+ jsonstr + “)”);

那再來如果使用的PHP版本非5.2之後，可以考慮其它人家寫好的套件，像PHP-json 算是library 如果不是自己架設的web server，可能就很不方便了，這裡有一篇網誌石頭閒語:PHP::JSON
in PHP – 樂多日誌有在介紹請自行參考
。除此之外，也可以使用Services_JSON (BSD license)，或者是Zend-Json (New BSD license)。不過Zend的Framework，在官網顯示PHP版本不能低於5.1.4，建議使用5.2.3以上的版本，所以看來幫助不大。

如果是php4的，可以參考以下兩篇，都有合適的lincude 函式庫可以使用：

相關參考資料:
http://nervstudio.blogspot.com/2007/02/ajaj-php-json-javascript.html

Categories: PHP Tags: jquery, json, php

Hero Think~用手摀住我的嘴

Archive

jQuery ajax使用在JAVA注意事項 – 編碼問題

jQuery 小技巧 – 在非UTF8語系網頁傳遞中文參數排除方式

jQuery 學習筆記(二) – Form 欄位應用

好用的Flash Mp3 Player（可用javascript控制喔)

JSON 解析與運用 for PHP

分類

近期留言

My Plurk

鏈結

彙整

Google AD

標籤雲

其他操作

2024 年 11 月
一	二	三	四	五	六	日
				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