擴充組件庫(Visual Studio Gallery) -- H3Viewer之正體中文語系檔

在Visual Studio 2010上市之前,MSDN文件庫做了一次改版,可以用很不習慣的方式來瀏覽MSDN文件庫,想不到在Visual Studio 2010上市之後,它本身內建的文件瀏覽程式也是以這種很不習慣的方式讓人瀏覽。

線上MSDN文件庫還好,修改設定就馬上變回原始樣式,但Visual Studio 2010強迫中獎,想改都沒得改。以前MSDN文件庫想安裝到本機,是要花錢買CD或DVD(買Visual Studio之類軟體會送給你),現在是可以直接下載安裝,對於不能上網的環境要查資料,就好像突然有人拿出3G網卡給你的感覺,很棒。

這又給我們一個很大啟發,當大家用的很習慣、非常習慣、超級習慣UI後,除非有明確的理由,不然,千萬不要去改UI,像之前fx改UI後,也是要罵的要命,MSDN文件庫和Visual Studio的幫助檢視器也差不多,而且帶頭罵的都是MVx級的大腳

MSDN文件庫還好,因為能改設定,但Visual Studio本身的幫助檢視器就「ㄍㄧㄠ到臭頭」(台),不過事情最終還是有解,馬上有人發現了一個好用的H3Viewer,此程式你可以從Visual Studio Gallery或他們的網站http://mshcmigrate.helpmvp.com/viewer下載。

H3Viewer使用起來感覺良好,而且發現H3Viewer還支援多國語系,看了一下,就是沒人要翻譯H3Viewer.lang.cht,小弟英文不好,就當成英文作業吧。

H3Viewer正體中文語系檔,解壓縮後,與H3Viewer放置同一目錄。目前使用上會有亂碼的情況,我已經與作者連絡,請他幫助確認是軟體的問題,還是我的翻譯檔有問題,但使用上沒有問題。

以上請服用。



2010/12/30 晚間補充
作者很用心的回信,他回答說在英文作業系統上測試我給他的檔案是正常不會有亂碼。而我在公司的Windows 7及家中的Windows XP的繁體中文版作業系統都會出現?的亂碼,真是怪怪!


Reference:

收不到客戶信件之Gmail

近期(一~二週),有許多同事反應會收不到客戶的信件,或是等了很久才會收到,後來幾經測試及查詢後,應是Gmail的問題。因為所有的來往的信件都與Gmail有關。

找了一下,Gmail有開一個「Gmail幫助論壇」(看了幾頁的留言,不太認為有官方人員在上面),如果你也有碰到這樣的問題,也請上去反應一下,試試看吧!

最早發佈者是2010-11-30日,但今天早上(2010-12-27日),公司有還使用者在問我「為什麼收不到客戶的信件」?我們的Mail Server怎麼了?

這我真不知道怎麼幫?

華碩網路雲端硬碟最新應用--Mear雲端音樂服務

之前我們介紹了「華碩雲端硬碟」與「華碩雲端硬碟軟體使用方法」兩篇,用了非常快速的時間,就爬上了我Blog瀏灠率的前幾名,那就快點再介紹一個華碩雲端硬碟的最新應用「Mear」,Mear是個雲端音樂服務,線上播放音樂沒什麼,但Mear直接與華碩雲端硬碟整合在一起後,就變的非常好玩。

當你註冊華碩雲端硬碟帳號登入Web後,


就你會發現在最旁邊多了一個有雲端音樂的Mear服務, 點入後,


點擊「我的雲端歌曲庫」,會直接去尋搜你的華碩雲端硬碟裡所有的音樂檔案。從右上方帳戶資訊旁的「設定」可指定要尋搜華碩雲端硬碟的目錄。

我的雲端歌曲庫找到歌曲後,會建立一個「長長長的List」,你可以在下方編輯「播放清單」,然後在「設定」下方,可以把「我的雲端歌曲庫」的List的歌曲,加到播放清單。

還有更強大分享功能,當你點選某一歌曲後,會看到後方有一個大大的F圖示,Mear可以直接將你要分享的歌曲分享給Facebook上的朋友們聽。

除了線上版,還有個人電腦DesktopAndroid版本,這又更棒了,這讓我們可以在任何「我們的電腦、手機」來播放華碩Mear雲端歌曲庫中的音樂。

在下載Desktop右方有個圖示,請點擊安裝:


它是透過Adobe AIR運作。


上面可以切換語系,目前有英文及繁體中文。(這裡高興一下,終於有那種預設中文非簡體中文的軟體,沒辦法,人家人口多)



這裡必須要有華碩雲端硬碟的帳號才能使用Mear雲端音樂服務,所以快點來申請一組帳號吧


跟WEB是統一的UI,這點很棒,基本上一模一樣。

Mear雲端音樂使用心得

  1. 支援格式不足
    目前華碩Mear雲端音樂僅支援*.mp3格式,其他常用格式如*.wma…等並未支援,希望未來能增加更多音樂格式的支援。我的歌曲庫裡*.mp3都是兒歌…@_@…我要*.wma啦!
  2. 浪費頻寬
    在Android有離線播放的功能,但在Desktop或Web版本未加入,你每播放一條歌曲,就會重新下載一次歌曲,下載速度約1MB ~ 2MB。
  3. 軟體未整合
    目前華碩Mear雲端音樂與華碩雲端硬碟兩個Desktop軟體是獨立的,必須分開執行,這點麻煩了點。
  4. 整合性佳
    目前使用起來,Mear加WebStorage整合的不錯,未來會不會再加上播放影片的功能呢?
1,2,3點都只是小缺點(如果你的音樂都是*.mp3,那第一點跟你無關),不影響我使用此功能的意願,看到這一個plus服務,我當初推薦這個華碩雲端硬碟,看來是對的。

Reference:

    XHTML與CSS免費參考資料

    Professional XHTML+CSS:網頁設計師的創意與實踐

    我有買這本書,寫的不錯,也很簡單入門,雖然是掛Professional,但讀起來很容易進入狀況,不會生澀難懂, 基礎的XHTML到CSS都有完整的介紹,另外它還有一份附件的參考資料,內容整理的很不錯,非常合適拿來複習之用:

    目錄:
    • XHTML元素、屬性一覽表
    • 各瀏覽器支援之CSS規則一覽表
    • 各瀏覽器支援之CSS選擇器一覽表
    • 各瀏覽器支援之CSS屬性一覽表
    • 瀏覽器的DOCTYPE Switch
    重點是可以免費下載,就算你沒買這本書,但以上的參考還是很棒,不下載太浪費了。

    下載:Professional XHTML+CSS:網頁設計師的創意與實踐 -- 附錄參考資料
    備份:Professional XHTML+CSS:網頁設計師的創意與實踐 -- 附錄參考資料(for .7z)

    Reference:

    Ajax在非UTF-8傳送中文資料注意事項筆記

    一般我自在寫Ajax程式時,會有兩個流程,
    1. pageA.html --> ajax --> pageB.aspx
    2. pageA.html <-- ajax <-- PageB.aspx
    1. 由PageA.html透過ajax向PageB.html傳送參數或資料;
    2. 由PageB.html回應處理結果,傳回文字(Text)、XML、json…等資料;
    3. PageA.html由回應結果,進行畫面處理。

    在處理一個非utf-8的網頁,如果你傳送回應「含(正體、簡體)中文」的資料,那會很慘,因為PageA.html傳送給PageB.aspx的資料,會含一堆亂碼的資料,而PageB.aspx回應也是一堆亂碼。就程式而言,是沒有問題,因為只有顯示是亂碼,其他都正常。

    造成亂碼的原因是Ajax使用的XMLHttpRequest元件預設使用utf-8來作業,所以在非utf-8的網頁使用Ajax要特別注意「中文」資料傳送及回應的問題。

    pageA.html --> ajax --> pageB.aspx

    由PageA.html傳送給PageB.aspx會含有中文資料,處理方式是在資料傳送前使用javascript的內建escape()編碼要POST資料。例如,

    var Name = document.getElementById('txtName');
    var QueryString = escape(Name.value);
    ...
    XMLHttp.send(QueryString);
    

    這樣PageB.aspx就能接收到正確的資料。

    javascript處理中文編碼函數參考

    • escape(string):編碼,會處理#字元為%23,空白字元轉換為+,中文字處理為UniCode。
    • unescape(string):反編碼escape(string)。

    • encodeURI(string):編碼,不會處理#字元,空白字元轉換為%20,中文字處理為UTF-8。
    • decodeURI(string):反編碼encodeURI(string)。

    • encodeURIComponent(string):會處理#字元為%23,空白字元轉換為%20,中文字處理為UTF-8。
    • decodeURIComponent(string):反編碼encodeURIComponent(string)。

    pageA.html <-- ajax <-- PageB.aspx

    當PageB.aspx要回傳給PageA.html的資料中含有中文資料,就ASP或ASP.NET而言,就是在PageB.aspx使用「Response.Charset="big5 | gb2312"」,強迫PageB.aspx以指定的編碼來回傳資料。這樣PageA.html的ResponseText或ResponseXML就會收到PageB.apsx所送回來含正確編碼的中文資料。

    當然最的方式就是PageA.html與PageB.aspx都使用utf-8,這樣最保險。

    Reference:

    Visual Studio 2010 新發現(8) -- 擴充組件庫(Visual Studio Gallery)

    Visual Studio 2010開發工具除了UI的改進外,我認為很棒的一部份是「擴充性」,就我而言,我覺得Visual Studio 2010不足的部份,都能在「Visual Studio Gallery」找到補強的擴充功能,更讚的是,大多數是免費

    以下推薦一些我用過覺得不錯的擴充組件庫,通常都是安裝完重開Visual Studio 2010就能使用,我幾乎沒有動過設定。因為每個人的開發方向不同,所以應該會有出入,記得Visual Studio 2010開發工具不足的部份,可以先上Visual Studio Gallery找找。

    Visual Studio 2010加強

    1. Productivity Power Tools
    2. Visual Studio Color Theme Editor
    3. PowerCommands for Visual Studio 2010
    4. VS10x Code Map
    5. VsVim
    2010/12/27 補充
    VsVim會直接把你的編輯模式模擬成Vim,如果你玩過Linux的Vim,那你就知道Vim強大非同等比,而且還是Linux裡的必修課,如果你會按i進入Insert模式、按esc離開現在模式…等很習慣,那你可以透過VsVim把Visual Studio 2010當成Vim來使用。別外可參考www.ViEmu.com,可下載到Vim速查表(cheat-sheet),如果你已經使用Vim到成魔、成仙的,可參考ViEmu其住外掛,來增強Outlook及SQL Server Management Studio。

    JavaScript加強

    1. Javascript parser
    2. VisualStudio 2010 JavaScript Outlining
    3. JSEnhancements
    4. JScript Editor Extensions
    5. JSLint.VS2010
    6. PrettyJs
    就撰寫Javascript而言,Visual Studio本身So So,但透過擴充組件庫的加持後,那就不一樣了。

    題外話,寫JavaScript有時我會用以前介紹過的開發工具Aptana Studio (基本上是Free)來寫。

    CSS加強

    1. devColor
    2. Chirpy


    devColor解決了長久以來在寫或看CSS的一個大問題,那就是顏色,平常要撰寫CSS顏色就很麻煩,不會在我們打完#或rgb馬上跳出個色盤,要設什麼顏色,自己想辮法,對於我們不是美工出生的,總不能永遠都只和AA、BB、CC、DD…FF做伴,例如,#FFFFFF或rgb(0,0,0)或rgb(50%, 50%, 50%),就算我們選好了顏色,回到CSS Code過沒幾秒鐘就已經忘了剛才設定,「#1a2b3c」「#f355cd」這是什麼?

    這時如果你有使用devColor,那就會偷笑。因為你所設定的顏色會立即提示在數值下方,devColor還會幫你管理現在CSS檔案裡所有有使用的顏色表,再來我自己發明的一小技巧,當你想使用色盤選擇顏色時,你可以先使用如「color: Aqua;」,因為"Aqua"之類預設值工具會提示,先亂選一個,再透過「Ctrl + click」技巧,去呼叫devColor的色盤出來選擇,這樣邊寫邊選的感覺~~真好!

    如果你會在Visual Studio 2010裡寫CSS,那我十分推薦devColor。

    又是題外話,寫CSS有時我會用以前介紹過的開發工具TopStyle (基本上是Free)來寫。

    題 外話3,自從由Visual Studio Gallery補強相關功能後,開Aptana Studio與TopStyle的次數越來越少中。


    Reference:

    JavaScript之無法form.submit()的錯誤

    先說,為了找這個錯誤,花了超過八個小時,不寫下來實在對不起自己。
    表單(Form),通常會先寫一些validate的javascript,今天碰到一個教科書上沒教的事,我們先看form:

    <form method="post" action="submit_form.html">
     <input type="text" id="test" />
     <input type="button" id="submit" value="Send" /><br />
     <span id="test_help"></span>
    </form>
    

    就一個TextBox與一個Button,span是拿來放訊息的,接下來我們寫個簡單的validateNonEmpty函式,驗證TextBox裡為是沒有資料即可:

    function validateNonEmpty(form){
     if (document.getElementById('test').value.length != 0){
      form.submit();
     }
     else {
      var help = document.getElementById('test_help')
      help.innerHTML = "No Data.";
     }
    }
    

    使用傳統HTML加上onclick事件:
    <form method="post" action="submit_form.html">
     <input type="text" id="test" />
     <input type="button" id="submit" value="Send" onclick="validateNonEmpty(this.form)" /><br />
     <span id="test_help"></span>
    </form>
    

    測試一下,發現在無資料時,Javascript可以正常運作,但在有資料時,Firebug會出現:

    form.submit is not a function
    http://127.0.0.1:8000/html/submit_form.html
    Line 9

    怪怪,明明就是form元素的submit,為什麼跟我說submit不是個函式,又不是沒寫過??????????之前我會花超過八個小時是因為那個表單又是Javascript又是jQuery,而且欄位又多,Debug起來費心費力,因為不確定是我寫的原生Javascript出錯,還是jQuery有錯,而且如果你頁面有引用jQuery的話,Firebug還會把錯放到jQuery身上,讓我一度以為我怎麼那麼厲害,隨便寫寫都能抓到JQuery的bug。所以在抓Bug時要使用「簡單原則」,如我能像上面一樣用簡單的作法,先進行測試,那…@_@…我的青春!

    為了讓網頁架構分明,所以們我們會分離「架構(XHTML)、行為(Javascript)、樣式(CSS)」,所以在原始抓bug的網頁裡我是用jQurey來bind()事件,所以整體是這樣:

    function validateNonEmpty(form){
     if (document.getElementById('test').value.length != 0){
      form.submit();
     }
     else {
      var help = document.getElementById('test_help')
      help.innerHTML = "No Data.";
     }
    }
    
    $(function(){
            $('#submit').bind('click',function(){
                     validateNonEmpty(this.form);
            });
    });
    

    <form method="post" action="submit_form.html">
     <input type="text" id="test" />
     <input type="button" id="submit" value="Send" /><br />
     <span id="test_help"></span>
    </form>
    

    這時會產生一樣的錯誤。很多事沒有你想的複雜。後來我不斷思考(看著錯誤訊息)及測試終於找出問題點。

    id="submit"是兇手

    原因是button裡的id="submit",因為我們要使用jQuery來bind(),所以為button加上了id屬性,這此按鍵又是拿來發送,所以很直覺給它一個submit名稱,沒想到一個submit要花八個多小時來處理。當你把名稱修改為非submit,例如id="send",程式立即生效,我想是這是id名稱與函數名稱「強碰」所造成的錯誤。

    由錯誤訊息推估,當我們執行form.submit()的取得是button這個物件,而非submit()方法。自己被自己害到!

    這也讓自己再學到一個經驗,取Javascript名稱不要與Javascript方法同名。還我八小時@_@。

    Reference:

    ASP.NET -- 同一個Master Page不同資料夾使用之路徑處理

    在早期寫ASP時代,在美工方面,最喜歡使用include方式,把各區塊切一切後,include到原始*.asp之中,main一塊、content一塊、sidebar一塊、footer一塊,如果頁面複雜些,那就你的原始code中滿滿的include程式碼。

    到了ASP.NET,有了Master Page,中文稱「主版頁面」,其實美工類的東西我碰的不多(其實是lazy),最近自己試著使用Master Page與CSS來進行的排版,排的還蠻有心得,CSS玩久了,好像是玩樂高積木,還不錯玩。

    Master Page讓我們很方便進行統一排面配置,結合到頁面時,會不會有一堆雜七雜八的Code,可專心在Content上,但碰到一個問題,就是不同目錄在使用同一個Master Page時,會出現找不到檔案的問題。

    例如,我在網站根目錄之下有「Site.master」檔案,內容引用CSS檔及jQuery檔:

    <link href="Styles/Site.css" rel="stylesheet" type="text/css" media="screen" />
    <script src="Scripts/jQuery/jquery-1.4.4.min.js" type="text/javascript"></script>
    

    在同一頁目錄之下的所有頁面,使用起來應讓是100%沒有問題,但如果你在其他目錄之下引用同一個Site.master檔,head引用的檔案會出現問題,例如在News目錄下引用根目錄之下的Site.master,會出現找不到Site.master的圖、檔案…等等。

    查了一下路徑,原來Site.master的路徑被換成:

    <link href="Styles/Site.css" rel="stylesheet" type="text/css" media="screen" />
    <script src="News/Scripts/jQuery/jquery-1.4.4.min.js" type="text/javascript"></script>

    CSS的link正常,但script被多加了目錄路徑上去,就算你在Master Page使用ASP.NET的絕對路徑「~/Scripts/jQuery/jquery-1.4.4.min.js」,complier後的路徑是「News/~/Scripts/jQuery/jquery-1.4.4.min.js」,還是不對。(是因為script不是ASP.NET伺服器控制項)

    最後上網查了一下,解決方式也很簡單,解法有二:

    複製原始Master Page

    在每個目錄下copy一份原始的Master Page,然後修改裡面的路徑。例如在News複製一份原始的Site.master,然後指定使用News/Site.master檔,Blog目錄一樣複製然後使用Blog/Site.master。

    好處
    如果你每個分類(News/Blog/Product/...)都會有不同的排版方式,因為*.master各自獨立,所以不會互向影響,每個版面修的改修,只影響各自分類的頁面。

    壞處
    如果你是要每個分類都有統一的版面,那複製就不是好辦法,複製*.master比較合適「客製化」,也就是每個分類頁面是有差異的,但如果是統一版面,那就是牽一髮動全身,一個*.master修改,其他所有*.master也要跟著修改。

    路徑轉換

    必須在Master Page裡使用in-line Code的寫法,為路徑進行ResolveUrl轉換即可。

    <script src="<%= ResolveUrl("~/Scripts/jQuery/jquery-1.4.4.min.js") %>" type="text/javascript"></script>
    

    像我現在在寫後台管理系統,需要的就是統一版面,使用複製*.master並不是好辦法,所以使用了ResolveUrl來轉換路徑之後,就可以在網站任何目錄及路徑之下使用根目錄的Site.master,而不會有任何問題。所以當你需一個統一版面的Master Page,記得為head裡的路徑加上ResolveUrl函數進行轉換。

    ps. CSS引用的link可以不用, 怎麼用路徑都是正確的,我也不知道為什麼?

    Reference:

    小孩帶金剛--舉一反三之"教你"

    話說,我們家大寶貝實在可愛,而且腦袋一定很好,常常能舉一反三,這個「反三」部份,就是今天的主題,因為這個「反三」常常讓我們好好的修正自己,修成正果真的好難,不要覺得你已經是完人了,不要覺得怎麼教了那麼多遍怎麼還是不會,原來,她是學你的

    好了,來看看我的孩子是如何用「反三」來修練金剛。

    不要用丟的

    平常我和婆婆教孩子應該算嚴,只要孩子有不好或不對的事,我們都會立即教她,像有一次早上起床後,她吵著要脫睡衣,婆婆就把睡衣的帶子解開,然後請他自己脫拿去放好,脫是自己脫,但大寶貝確丟到地上,然後叫婆婆拿去放。

    婆婆當然是不高興,然後用生氣的口氣說,妳怎麼可以丟衣服在地上,然後就用快殺人的眼神,加上充滿力氣的食指,指著房間說:「自己pick-up,拿回去房間。」

    其他如「丟玩具、丟書、丟食物…」當然都會被制止,然後說教一番。

    就在不久後的一天晚上,當大寶貝在bathtub說她要看書書(先說明一下,我們有買「洗澡書」也就是塑膠做的書,可以在洗澡時看的書),婆婆就很順手的把書到bathtub裡,然後我們小聰明立即來個回馬槍說:「書書不要用丟的,書書不要用丟的。」

    我和婆婆雙眼對看,苦苦的笑了。婆婆也立即認錯,過去去把書拿起來,好好的放下去,然後說對不起是媽咪不起。

    媽咪說不能買

    假日總是要去補些貨,所以總是要走一趟super market,男生比較理性,要買什麼看什麼,女生比較感性,東看西看,看不夠再左看右看,之前我也提過,大寶貝出門總是「摸摸看看就好」,而婆婆實在教的太好,在走走逛逛過程裡,總會出現一些我想拿起來看,看了之後又想買的東西

    就在這時候,大寶貝就會把東西接手過去,然後也看了看,然後請三媽婆婆上身,用非常婆婆的聲調、口氣、身段…說:「媽咪說不能買,看看就好,放回去!」然後把東西退還給我,請我放回去。

    …人客呀…-_-"

    跟我說謝謝


    言教不如身教,但身教與言教必須同時教育,婆婆在小地方就會要求大寶貝,像禮貌就是小細節又重要的地方,平常只要我們幫忙大寶貝做什麼事,我們就會請她要說「謝謝」,而學習力超強的大寶貝也會用這招。

    我們會要求她幫忙做一些事,像吃飯時幫忙拿碗筷,吃完飯幫忙收東西,或許你看了會很怕,叫一個才滿二歲的孩子做這些事,因為碗盤都是瓷的,但是她幫的很好,吃完飯會問你說,你吃完了嗎?或很心急的就把碗收了!她把碗盤拿去洗碗槽後,就很快樂的過來說:「跟我說謝謝。

    第一次時,我也是和婆婆兩眼對看後傻笑。現有我們也在學習當一個有禮貌的父母親。

    以上只是其中的一部份。大寶貝常常讓我們了解,原來我們教她要求她,但我們己自都沒做好身教與言教,我們也很高興,她也能要求我們和我們要求她一樣的事,教互相長。我們以為教了她,她就應該會了,會了不應該再犯,但當她用我們教她的道理來教我們時,原來,這些我們認為100%不應該再犯的錯,連我們都還在犯,那何況只是一個孩子呢?

    我感謝我的孩子,每次請某某人上身時都讓我們受益良多。

    Other list:

    保母帶小孩--新竹市北區延平路三段

    年紀:0 ~ 5 歲
    名額:1 ~ 2 名
    地點:新竹市北區延平路三段
    證照:有合格證照
    費用:不收三節
    教學:含教學課程
    其他:面談
    時間:即日起 ~
    連絡:請Email到:「kingkong點bruce(at)gmail點com」或「下方留下你的連絡方式(我不會公布)」。

    以下我個人推薦信:

    「這位保母,是全世界最有愛心,最會教小孩,她是我看過的保母裡,最棒的一位,能讓她帶到的孩子,會是最幸福的孩子。她愛小孩,她還在上班時,每個來她們班的孩子,笑的進來,笑的出去,不管是心情還是功課,連家長都愛死了。當她離開時,每個孩子都哭了。這樣你就能知道,能給她帶的孩子是多麼幸福,我相信她能讓你的孩子跟別人不一樣。」

    歡迎各位轉寄此訊息給有需要的人,名額有限,額滿為止。

    jQuery -- jquery-1.4.4-vsdoc.js會讓jQuery無法運作

    我們在Visual Studio 2008後期增加了對jQuery支援,後來的Visual Studio 2010是全面支援,現在我們很方便的只要從Microsoft Ajax CDN引用jQuery*.js及jQery*.-vsdoc.js,就能同時使用jQeruy及即時性的說明訊息,即時性的說明訊息對我而言是很重要的,尤其常常寫東西會東少一點西少一點。

    在使用最新jQuery 1.4.4版,奇怪,怎麼連個alert('Hi');都不理我,後來查看了一下Firebug,才知道原來是引用「http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4-vsdoc.js」這個jquery-1.4.4-vsdoc.js有問題:
    class2type is not defined
    http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4-vsdoc.js
    Line 2404

    原因很清楚了,這個jquery-1.4.4-vsdoc.js有bug,會造成jQuery無法運作。

    解決的辦法有二:

    1. 移除使用jquery-1.4.4-vsdoc.js
      當你要執行網頁時,先將引用link移除,那你的jQuery程式就可以work了。經過測試,目前1.4.1、1.4.2、1.4.3、1.4.4版本(1.4無提供*.-vsdoc.js),只要引用*.-vsdoc.js,都會造成網頁上jQuery無法運作。
    2. 改引用jQuery 1.3.2版本,就能正常work了。
      http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.3.2.min.js
      http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.3.2.min-vsdoc.js

    除非你有特別使用到jQuery 1.4.x版本的功能,不然我是採用方法二,反正只要在Visual Studio裡開發方便即可,正式上線再修改為目前最新版本的jQuery 1.4.4即可。

    ps討論:

    我jQuery 1.2.6或jQuery 1.3.2用的好好的,為什麼上線前還要換成jQuery 1.4.4版,我個人的想法是「效能」。目前我的程式由jQuery 1.2.6升級為1.3.2再升級為1.4.4,都無出錯的現象,但單單得到的效能,可說是「倍數」成長,在執行大量Javascript時,這可不能說不補,畢竟當我們點網頁時「快、還要更快」,最好都能在0.x秒內完成@_@!

    第二篇:簡單介紹JavaScript內建物件

    1. String物件
    2. Array物件
    3. Date物件
    4. Math物件
    5. Error物件
    6. Common物件

    建議使用右下方Popout按鍵來「全螢幕」觀看。


    History

    2010/5/7,整理為xmind;
    2010/11/30,整理為Text。

    String物件

    HTML標籤的格式編排


    Tag

    說明

    anchor()

    傳回<a>string</a>標籤字串

    big()

    傳回<big>string</big>標籤字串

    blink()

    傳回<blink>string</blink>標籤字串(I.E不會閃)

    bold()

    傳回<b>string</b>標籤字串

    fixed()

    傳回<tt>string</tt>標籤字串

    fontcolor(color)

    傳回<font color="color">string</font>標籤字串

    fontsize(size)

    傳回<font size="size">string</font>標籤字串

    italics()

    傳回<i>string</i>標籤字串

    link(url)

    傳回<a href="url">string</a>標籤字串

    small()

    傳回<small>string</small>標籤字串

    strike()

    傳回<strike>string</strike>標籤字串

    sub()

    傳回<sub>string</sub>標籤字串

    sup()

    傳回<sup>string</sup>標籤字串

    字串長度與大小寫


    length

    取得字串的長度

    toLowerCase()

    將字串的英文字母都轉換成小寫字母

    toUpperCase()

    將字串的英文字母都轉換成大寫字母

    取得字串的指定字元


    charAt(index)

    取得參數index位置的字元,索引值是以0開始

    charCodeAt(index)

    取得參數index位置的Unicode統一字碼

    子字串的搜尋


    indexOf(string, index)

    傳回第一次搜尋到字串的索引位置,如果沒有找到傳回-1,傳入的參數為搜尋的字串,index為開始搜尋的索引位置,如無index參數,則預設index=0

    lastIndexOf(string)

    如同indexOf()方法,不過是從尾搜尋到頭的反向搜尋

    match(string)

    如同indexOf()和lastIndexOf(),不過傳回的為找到的字串,如果沒有找到傳回null

    search(string)

    與indexOf()的功能相似

    子字串的處理


    replace(string1, string2)

    將找到的string1子字串取代成為string2

    split(string)

    傳回Array物件,使用參數string作為分割的字串,將字串轉換成一個Array物件

    substr(index, length)

    從index開始取出length個字元

    slice(index1,index2)

    取出index1到index2間的子字串

    substring(index1, index2)

    取出index1到index2間的子字串

    concat(string)

    將string字串新增到String()物件的字串後
    slice與substring差別在負數處理不同
    slice將負數當成從字串尾往前計數

    var sWord = "1234567890"
                document.write(slice(2,-3));
                //第一個index(2)會從3開始
                //第二個index(-3)會從從尾到數三個後的下一個開始取值
                //Ans: 34567
       
    用白話來講就是:從index2開始取,取到數第三個為止


    substring則直接忽略負數,當成0來處理


    substring(2,-3) = substring(2,0) = substring(0,2)
                

    字串轉換為數值


    parseInt(str,進位數)

    將字串轉換為整數,parseInt("010")會得到8, parseInt("010", 10)才會得到10,強烈建議進位數一定要設定

    parseFloat()

    將字串轉換為浮點數

    Array物件

    Array宣告


    var team = new Array(9);

    宣告一個0~9共10個的Array,team[0], team[1]…

    var team = new Array();

    宣告一個空Array,可任意新增值到Array中,例team[20] = 'Bruce';即會產生team[0~19]的空Array,team[20]為指定值

    var team = new Array('Bruce', 'Sherry', 'Daniel');

    直接帶值宣告team[0],team[1],team[2]三個Array

    var team = ['Bruce','Sherry','Daniel'];

    透過[]符號直接宣告Array及值

    Array物件的屬性和方法


    length

    屬性,取得陣列的元素個數,也就是陣列的尺寸

    join()

    將陣列的元素使用字串方式顯示,每個陣列元素使用「,」符號分隔,可指定使用的分隔符號,a.join('-->')

    reverse()

    將陣列的元素反轉,本來是陣列的最後一個元素成為第一個元素

    sort()

    將陣列所有元素進行排序

    concat(array)

    將參數的陣列合併到目前的陣列中,
    var a = [1,2,3,4,5], b = [6,7,8,9,0];
                        document.write(a.concat(b).join());
         

    push()

    由push()與pop()來寶現堆疊(stack),stack.push('a');將a字串放入stack陣列

    pop()

    先進後出,由最後一個Index來取出Array,例如,push()進去a,b,c三個值,那pop會由c,b,a順序取出

    自訂陣列排序方式

    排序行為可由比較函式(comparison function)來決定

    function compare(x,y){
                return x-y;
                }
                a.sort(compare(x,y));
       

    a.sort(function(x,y){x-y});
                
    compare回傳值
    • <0,x排序於y前
    • 0,不排序
    • >0,y排序於x前

    Date物件

    ECMAScript把日期儲存離UTC時間1970年1月1日0點的毫秒數

    取得日期和時間


    getDate()

    傳回日期值1~31

    getDay()

    傳回星期值0~6,也就是星期日到星期六

    getMonth()

    傳回月份值0~11,也就是一到十二月,一般都會取值再加1才是我們看的數字

    getFullYear()

    傳回完整的年份,例如:2012

    getYear()

    傳回年份,如果在1900~1999年間,傳回後兩碼,例如:1998年傳回98,否則傳回完整的年份

    getHours()

    傳回小時0~23

    getMinutes()

    傳回分鐘0~59

    getSeconds()

    傳回秒數0~59

    getMilliseconds()

    傳回千分之一秒為單位的秒數,0~999

    getTime()

    傳回自1/1/1970年開始的秒數,以千分之一秒為單位

    設定日期和時間

    這些設定的方法並不會修改電腦的時間和日期,只是設定Data物件記錄的時間和日期。

    setDate()

    設定Date物件的日期1~31

    setMonth()

    設定Date物件的月份0~11

    setFullYear()

    設定Date物件的完整年份

    setYear()

    設定Date物件的年份,在1900~1999間只需使用後兩位,否則需要使用完整的年份

    setHours()

    設定Date物件的小時0~23

    setMinutes()

    設定Date物件的分鐘0~59

    setSeconds()

    設定Date物件的秒數0~59

    setMilliseconds()

    設定Date物件的秒數,以千分之一秒為單位,0~999

    setTime()

    設定Date物件的時間,自1/1/1970年開始,以千分之一秒為單位

    日期和時間的轉換


    getTimezoneOffset()

    傳回本地時間和GMT的時間差,以分為單位

    toGMTString()

    傳回轉換成GMT時間的字串

    toLocalString()

    傳回將GMT轉換成本地時間的字串

    parse(Date)

    傳回參數Date物件從1/1/1970到本地時間的毫秒數,以千分之一秒為單位

    UTC(Date)

    傳回參數Date物件從1/1/1970到GMT時間的毫秒數,以千分之一秒為單位

    Math物件

    屬性


    E

    自然數e=2.718281828459045

    LN2

    ln2=0.6931471805599453

    LN10

    ln10=2.302585092994046

    LOG2E

    log2e=1.4426950408889633

    LOG10E

    loge=0.4342944819032518

    PI

    圓周率=3.141592653589793

    SQRT1_2

    根號1/2=0.7071067811865476

    SQRT2

    根號2=1.4142135623730951

    亂數、最大值、最小值


    max(value1,value2)

    傳回參數中的最大值,參數無限制

    min(value1,value2)

    傳回參數中的最小值,參數無限制

    random()

    傳回擬亂數值

    round(value)

    將參數值四捨五入後傳回

    數學方法


    abs()

    傳回絕對值

    acos()

    反餘弦函數

    asin()

    反正弦函數

    atan()

    反正切函數

    atan2(y,x)

    反回原點和座標(x,y)的連線,與x正軸的夾角

    ceil()

    傳回大於或等於參數的最小整數

    cos()

    餘弦函數

    exp()

    自然數的指數ex

    floor()

    傳回大於或等於參數的最大整數

    log()

    自然對數

    pow()

    次方

    sin()

    正弦函數

    sqrt()

    傳回參數的平方根

    tan()

    正切函數

    Error物件


    number

    錯誤碼,這是一個32-bit的值,其中後16-bit才是真正的錯誤碼(IE)

    message

    錯誤說明的字串

    description

    如同message屬性,這也是錯誤說明的字串(IE)
    單層除錯

    try{
             // javascript需要錯誤測試的程式碼
            }
            catch(e){
             //錯誤處理
            var errMessage = '';
            for (var i in e)
             errMessage += i + ":" + e[i] + "\n";
             console.log(errMessage);
            }
            finally{
             //不論錯誤是否產生,都會執行此區塊
            }
     
    多層除錯

    try {
             ...
             try { //第二層
              ...
       }
             catch(e){
              ...
             throw e; //丟出錯誤
        ...
             }
            }
            catch(e) {
             ... //第一層錯誤
            }
            finally {
             ...
            }
     

    onerror事件

    當頁面出現JavaScript錯誤,會觸發window.onerror事件

    window.onerror = function(){
            //使用Firebug收集Log
            console.log("Error!");
            }
            
     
    onerror事件提供三個參數

    1. 參數一:傳入錯誤訊息

    2. 參數二:傳入錯誤的URL

    3. 參數三:傳入錯誤的行號
    window.onerror = function(message, url, line){
             //使用Firebug收集Log
             console.log("Error:\n %s \nURL: %s \n行號: %s", message, url, line);
             return true; //取消系統事件
            }
     
    console.log為Firebug Console API用法。

    共用屬性與方法

    共用屬性


    constructor

    javascript物件的constructor屬性,可以取得建立物件副本使用的建構函數名稱(除Global和Math都支援)
    檢查物件的建構函數是否為String()
    var test = new String();
        if (test.constructor == String){
         ......
        }
        
    

    toString()


    toString()

    傳回物件的內容,傳回值為字串,object.toString();

    toString回傳值


    Array

    將陣列元素轉換成「,」符號分隔的字串

    Boolean

    true傳回字串"true",false傳回字串"false"

    Date

    傳回日期和時間的字串

    Error

    傳回錯誤息訊的字串

    Function

    傳回字串格式"function name() {...}",其中name為呼叫toString方法的函數名稱

    Number

    傳回數字字串。數值轉字串,同時進制轉換:


    var a=15;


    a.toString(8); //8代表8進制


    a.toString(16); //16代表16進制



    String

    傳回String物件的內容

    valueOf()

    傳回物件值(Math,Error不支援);
    object.valueOf();

    valueOf()回傳值


    Array

    將陣列元素轉換成以「,」符號分隔的字串,如同Array.toString和Array.join方法

    Boolean

    傳回布林值

    Date

    傳回前晚到現在的秒數,以千分之一秒為單位

    Function

    傳回函數的本身

    Number

    傳回數字

    Object

    傳回物件本身

    String

    傳回字串

    免費可在Windows Vsita / 7上使用的RamDisk -- Dataram RAMDisk

    在記憶體不斷成長,價錢又不斷下降之下,在Windows XP或Linux等32 bit作業系統開始出現一個問題,當你安裝了4 GB以上的記憶體,最多也只能使用到3 GB,這是受限於32 bit作業系統本身,除非升級至64 bit作業系統,不然算是無解的問題。

    後來人們發現,在平時的電腦裡,我們根本用不到那怎多的記憶體,或,我有沒有可能把那「不見的1 GB Ram」拿出來用?這時候就有Clever的人,想出了Ram Disk的概念,即我們那些用不到的Ram拿來建成Disk,因為這個Disk是由Ram所建立,所以速度上當然「快很多,非常多,超級多」。

    Ram Disk 作用一

    也由於是在Ram裡面運作,所以也可以有效減少HDD的讀寫動作,進而有效保護HDD,例如,我們使用P2P在下載資料,但P2P的下載動作是含「超大量」的讀寫動作,對HDD而言只能用一個字「操」來形容。所以我們就可以把P2P下載的Temp目錄設定到Ram Disk裡,完成目錄再設定到HDD中,讓HDD只單純做一次性讀寫。

    Ram Disk 作用二

    另外有人發現,Ram Disk很合適拿來放「暫時性」資料,因為Ram裡的資料,在關機時就會消失不見,完全不會佔到HDD任何一滴滴空間,例如:Browser的暫存資料。

    Ram Disk 作用三

    在文書作業上,Ram Disk也可以有很大的幫忙,如果你需要常開些大檔案來作業,例如,Word、PowerPoint…等都是圖檔的大型檔案,或影片檔,就合適先Copy到RamDisk再來開啟作業,原因我們上面說過了,HDD與RamDisk的速度,就跟龜兔賽跑的差別差不多,一個在天一個在地,所以透過Ram Disk的幫忙,讓我們進行大檔案文書工作時,可以更加流暢。但請記得,要把修改好的內容Copy回去HDD,這也是為什麼最後是「龜」贏而不是「兔」贏。

    以上談了那怎多,那最重要的Ram Disk呢?說到RamDisk且免費的,在Vista之前,大概都是Gavotte RAMDisk的天下,但在Windows XP之後,Gavotte RAMDisk就沒再開發下去,所以在Vista或Vista之後的64 bit作業系統,除非你花錢,或找得到「快樂版」。

    近來終於發現了一個新又免費的Ram Disk程式,Dataram RAMDisk, 此免費版本只有一個限制,就是最大只能建立4 GB的Ram Disk,就算是付費無限制版本,也才9.99美元。免費版對我們而言已經是非常足夠。

    我下載的是「Dataram_RAMDisk_V3.5.130RC16」版本,

    Dataram  RAMDisk Download

    Dataram RAMDisk不只是Windows Vista、Windows 7,就連Server 2003、Server 2008都一樣支援,這會不會太佛心了!讓我們感謝作者一下。謝謝你。(如果你有找過或看過其他付費RadDisk,你就會知道為何要謝謝他了。)

    安裝時,最好先按右鍵,使用「系統管理員」的權限來安裝( 我在Windows 7 32 bit並不需要,應該是64 bit的才需要)。

    程式設定畫面

    Disk Size是你要建立的Ram Disk大小,格式建議使用「FAT32 Partition」,Boot Sector Settings也建議使用「Windows boot sector」,確認好之後按下「Start RAMDisk」就會開始建立RamDisk及Format,依大小會待不一的時間。

    工作管理員之記憶體使用情況

    完成後,你會發現,你電腦的記憶體使用數量,馬上上升1 GB,這就是傳說中,把Windows作業系統不見的1 GB找回來的方法,或是說讓Windows 32bit作業系統可以使用4 GB以上的方法

    RamDisk

    如果你記憶體夠,建議可以建個2 GB的RamDisk,然後使用ReadyBoost,這會讓你的開機速度再加速提升。再來就可以把上述那些暫存資料放到Dataram RamDisk之中。


    備份RamDisk中的資料

    那你會說,如果我想要保存在RamDisk的資料,可不可以?
    答案是:可以。

    在Gavotte RAMDisk時,必須是「開機指令碼」及「關機指令碼」來將RamDisk的資料在關機時存回HDD,開機時由HDD讀回RamDisk之中。但使用Dataram RamDisk不用那麼麻煩,我們可以直接設定,它就會幫我們進行Ram Disk的資料備份及還原動作,是不是很棒呀!

    Load and Save

    這夠明顯了吧,Load是開機時進行,Save是關機時進行,而且Save還能定時備份,這樣就你不用怕如文書作業到一半確掛點的問題。另外,Dataram RamDisk是使用類似Ghost的image檔案方式來存放你的RamDisk資料,這點我覺得很棒!

    Load Image Settings

    重點只有一個,把「Load Disk Image at Startup」打勾!其他是要存Img的路徑,還有是否要建立一個目錄來放Image檔。

    Save Image Settings

    重點只有一個,把「Save Disk Image on Shutdown」打勾!其他是否要定時備份,或按一下「Save Disk Image Now」來立即儲存Image檔。

    Load and Save Settings

    Dataram RamDisk Image

    注意最後的Image大小,你建立1 GB的RamDisk,就會是1 GB的Image,由此證明,Dataram Disk的Image不是單純copy檔案,而是真正進行Image動作的Image檔案。另外,根據Reference第二篇有網友反應,所修改IE到RamDisk後會有問題,我自己家中是使用XP + Gavotte RAMDisk,並無此問題。我是有碰過修改IE路徑後,電腦執行就不太正常,改回來後就一切正常的情況,建議修改前將IE暫存「原始」路徑寫下,如出現問題,再修改回去即可。

    最後,如果你有使用Load and Save功能,那就是在開機或關機時,會有那麼一點點Delay,原因上面說過了,關機Dataram RamDisk要製作Image檔,開機要將Image檔讀入, 可是這一點點Delay可是能換來非常高的效能提升,是非常值得的。

    Reference:

    最後Reference,Google Chrome暫存檔的設定簡單:「Chrome執行路徑 + --user-data-dir=暫存目錄」,以我電腦為例,「"C:\Users\IPC\AppData\Local\Google\Chrome\Application\chrome.exe" --user-data-dir=H:\Chrome」,你可以建立「捷徑」的方式,或,直接修改快速啟動列裡Chrome程式路徑加上參數,程式路徑要包在雙引號之內("~")後面加參考,這樣你就能指定Google Chrome暫存路徑到RamDisk裡。

    推薦一些讓你學好英文的書--專門替中國人寫的英文課本,幼福2043系列

    不讀書的快樂童年--英文,我一輩子最錯誤的決定

    幼福2034童書

    我在之前提過,放棄學英文是我一生最錯誤的決定,但近來我又重生了,為什麼重生,首先感謝我們兩位寶貝,大寶貝能動能靜,靜時,最喜歡我們陪她一起看書,依據婆婆的說法,最高記錄是一天看了近三十本的童書。我們還怕她看太多,每三、五本,還會叫她去看一下天空,讓眼睛休息一下。

    這些童書我絕大部份都是買幼福公司出版的「2034、2035」系列。

    2034很合適與小朋友一起看,不論是中文或英文部份,就英文部份,我發現童書的好處是「用字簡單」,你能看完一個完整的故事文章,且因為要陪孩子看,所以又會不斷重覆看,所以就能慢慢接受英文,你能慢慢增加對英文的興趣及信心,原來英文是不那麼難。而且,2034、2035系列,是中、英文有聲書,我都會先放英文再放中文給寶貝們聽,英文約10~15分鐘,中文約30~45分鐘,可以一邊學英文,又可以一邊聽故事,真是一舉二得。

    經過與大寶貝一起看英文童書的心得後,後來又去峇里島自由行,在峇里島時,不知是不是常聽童書故事CD的關係,發現,我聽力變好了,他們說的內容大概都還能聽得懂。

    我個人分析過,因為讀資訊的關係,我讀的很認真,所以「專業英文」還可以,基本上看相關技術文件都還沒問題,但…日常英文就很…馬馬馬馬虎虎虎虎(就是比馬馬虎虎還低一些)。我了解自己英文那裡有問題,就重新分配時間,之前的小說,抱歉了,我還有更重要的事要先做。

    我想學好英文。

    專門替中國人寫的英文課本

    後來無意中發現了一套英文教學書:「專門替中國人寫的英文課本」,這個標題讓我很好奇,一翻,原來是李家同教授所策劃的一套英文教學書,我看了一下books的書評,好吧,也才100出頭元,沒看沒事,看了出事,一整個醍醐灌頂。

    我才看完「初級本 (上)(下)」兩本,說真話,我一真以來都留在背單字階段,用單字在看句子。我紮實的練習書中的內容,比起過起任何一本英文書還有用,我真的是他那書中的中國人。這套「專門替中國人寫的英文課本」不是要拿來考試拿成績,而是要讓我們學習「使用英文」而非只是背單字、片語。

     Let we going to English world together.

    如果你在聯經整套購買,例如,整套「聯經:專門替中國人寫的英文課本」共六本加其他兩本,我算了一下,比75折還低,實在划算。

    如果你有心要學英文,但又不得其門而入,我推薦這套由「作者/文庭澍、策劃審訂/李家同」所撰寫的「專門替中國人寫的英文課本」,不管你英文有多爛,我相信這套書都能救得了你。

    除了書中的練習,你還可以上「李家同教授的英文教室」,依你學習的進度去Practice,它每週換一次題目,讓你除了書中的內容,還可以多Practice其他的內容,多看、多寫、多聽、多說,準沒錯!

    e-coupon大放送

    Thank you to look me blog, I want send some gift for you. You can buy anything in Internet bookstore. I hope you like it. ^_^

    (請已使用者回覆留言,說你已使用那一組序號)
    Books.com.tw 100 E-Coupon:

    以下為面額100元E-Coupon序號:DBJB7vgN

    注意事項:
    1. 使用期限為:2010年11月23日~2010年11月30日止,逾期無效。
    2. 使用限制:單筆訂單滿888元(含)以上方可折抵使用。

    iread.com.tw 25*2 E-Coupon:

    6aAu2eWprs 使用期限:2010/11/23~2010/12/24
    UsSqqORowV 使用期限:2010/11/23~2010/12/24

    CSS, jQuery -- 動態調整網頁文字大小設計技巧

    我們計設網頁時,都必須做一個非常全面的考慮,當字型考慮好了之後,然下來考慮文字的大小。文字對大家影響很大,太小看不清更,看起來吃力,太大又很奇怪,但你面對的使用者又是那種「一種米養百種人」的情況,這個說太大,那個說太小,怎麼辦?

    那就要從最開始設計CSS時,就把文字大小的關係處理好,那接下來就可以很輕鬆搞定網頁上文字大小的問題。

    基本這問題不難,先首第一步,必須利用CSS的「繼承」關係,由上而下繼承一個「主大小」,然後依各「元素」所需去自訂自己需要的大小,而非由各元素去各自自訂大小。

    先看一個各元素去各自自訂大小的範例:

    h1 {
      font-size: 24px;
    }
    
    h2 {
      font-size: 20px;
    }
    
    h3 {
      font-size: 16px;
    }
    
    p {
      font-size: 14px;
    }
    

    以上這種各自玩各自的遊戲,盡量不要,現在是合作的社會,所以我們來玩繼承合作遊戲:

    body {
      /* 一般都會選擇 small 或 medium為主大小;
         small約 12px; medium 約 14px;
      */
      font-size: small;
    }
    
    h1 {
      /* 12px * 200% 約 24px */
      font-size: 200%;
    }
    
    h2 {
      /* 12px * 160% 約 19px */
      font-size: 160%;
    }
    
    h3 {
      /* 12px * 120% 約 14px  */
      font-size: 120%;
    }
    
    p {
      /* 12 * 1.5 = 18px  */
      font-size: 1.5em;
    }
    

    經由body來設定為主要字型大小,讓以下所有元素去「繼承」這個字型大小的設定,需要改變時,只需要利用「%, 百分比」或「em, 倍」的用法,即可立即享受到繼承的好處,例如,使用者覺得字太小了點,你只需要將body中「font-size: small;」改為「font-size: medium;」那整個網頁就馬上會將字型放大,而且相關的元素也會立即跟著變更,而不用一個一個去調整。

    再來,我想讓使用者去手動變更網頁上字型的大小,怎麼做?

    jQuery -- 手動讓使用者動態調整網頁文字大小

    這邊我透過jQuery示範:

    $(function(){
     // 加上flag是為了讓文字有切換的效果
     var flag = false;
     // 在一個input上(id=click)註冊onclick事件
     $('#click').bind('click',function(){
      if (flag){
       $('body').css('font-size','medium');
       flag = false;
      }
      else {
       $('body').css('font-size','large');
       flag = true;
      }
     });
    });
    

    其實很簡單,我們只要透過修改body裡的css屬性,將font-size變更,網頁立即產生效果。


    學會CSS中繼承關係,你也能有像Yahoo國際水準的功能哦!

    第一篇:簡單介紹JavaScript

    1. 變數命名
    2. 資料型別(data type)
    3. 關鍵字
    4. 保留字
    5. 比較符號
    6. 邏輯符號

    建議使用右下方Popout按鍵來「全螢幕」觀看。


    History

    2010/05/06,整理資料至xmind。
    2010/11/23,xmind內容轉為文字輸出。

    ECMAScript(262)

    ECMAScript定義了指令碼語言的所有語法、類型、語句、關鍵字、保留字、運算子和物件等,其他語言可以實現ECMAScript來作為功能基礎,JavaScript就是其中之一。




    ECMAScript

    JavaScript

    ActionScript

    ScriptEase

    BOM

    Browser Object Model,BOM提供Web開發者移動視窗、改變狀態列…一些與網頁內容無關的動作。

    DOM

    Document Object Model, 一種與瀏覽器、平台、語言無關的介面,DOM把整個網頁標籤轉換成節點樹架構的文件。

    Web標準

    將網頁分離為三個部份,結構、表現、行為。

    1. Structure--(X)HTML
    2. Presentation--CSS
    3. Behavior--JavaScript

    傳統HTML的缺點

    1. 維護困難 為了修改某個標記格式,需要花費很多時間,越後期的修改、維護成本越高。
    2. 標記不足 HTML本身標記不足,HTML本身標記都是內容服務使用,關於美工、排版根本很少或沒有支援。
    3. 網頁過胖 傳統網頁除了包含HTML外,還加上CSS、JavaScript,最後還會加上動態程式語言,除了維護困難,頁面往往過於胖大,浪費許多頻寬。
    4. 定位困難 HTML在定位時就顯得捉襟見肘,過多的<table>也導致頁面的複雜和後期維護的困難。

    對網站瀏覽者的好處

    1. 檔案下載、頁面顯示更快
    2. 內容能被更多使用者訪問(含殘障人士)
    3. 內容能被更多設備訪問(PDA、智慧手機…)
    4. 使用者能透過CSS選擇自己介面風格
    5. 由CSS提供適合列印版本

    對網站開發者的好處

    1. 更少的程式碼
    2. 更容易維護
    3. 頻寬要求更低,例如,ESPN.com使用CSS改版,每天節約超過2TB的頻寬。
    4. 更容易被搜尋引擎接受,及更高的排名
    5. 改版方便(結構、表現、行為分離)
    6. 提高網站易用性,例如,美國:Section 508、台灣:無障礙空間、國際:WCAG

    ECMAScript語法

    1. 區分大小寫
    2. 弱類型變數:定義變數只用"var"關鍵字,並可以初始化為任意的值。
    3. 每行結尾的分號可有可無


      養成良好的程式設計習慣,為每一句程式結尾都加上分號。


      在新版Browser中,不加分號會有問題
    4. 括孤{ }用區程式碼區塊
    5. 註解


      //這是單行註解


      /*


      這是多行註解


      */

    變數

    1. 變數是透過var關鍵字來宣告,是記憶體裡獨一無二名稱(unique name)的存儲位置(storage location)。
    2. 變數在使用之前都應宣告(雖然不宣告也能使用)。
    3. 未宣告的變數,會自動建立為全域變數(在函式內也一樣),並初始化為指定的值。
    4. 同一變數應該只儲存一種資料型別,建立一個有初始值的變數,是種好習慣。

    命名

    1. 字首必是英文字母、底線(_)或$符號。
    2. 其他可以是英文字母、底線(_)、數字、$符號。
    3. 變數不能是關鍵字或保留字。

    命名規則

    Camel

    • 首字母小寫,其他單字字首大寫
    • studentName, classNumber
    • 用於變數和函式

    Pascal

    • 首字母大寫
    • FirstName, LastName
    • 用於物件

    匈牙利

    改良Pascal,在變數前加上(一個或一組)小寫字母來說明變數的型別。

    • i代表Integer,s代表String
    • int代表Integer,str代表String

    項目

    範例

    縮寫

    陳列

    a / arr

    sStudents

    布林

    b / bln

    bSex

    浮點數

    f

    fTax

    函數

    fn

    fnSwap

    整數

    i / int

    iAge

    物件

    o / obj

    oCar

    正規式

    re / reg

    reTWID

    字串

    s / str

    strName

    常數

    1. 常數用來建立一個不會改變的值,除了修改JavaScript原始碼之外。
    2. 常數透過const關鍵字來宣告
    3. 常數習慣以「全大寫字母」來命名,例如,const TAXRATE = .5;。
    4. const關鍵字最近才加入JavaScript,使用前請多檢查。IE到目前都還不支援(IE8)。

    初始化

    1. 初始化背後的概念,在於避免存取沒有存入值的變數。
    2. 如果宣告時還不知變數值,可先使用「什麼都沒有」來當值,減低存取未初始化變數的風險。

    初始值

    範例

    "",空字串

    var name="";

    0,數值

    var price=0;

    false,布林

    var Select=false;

    變數範圍(scope)

    scope掌控變數的生命週期,還有程式碼是否可以存取變數。

    區域變數(Local Variables)
    在函數內宣告的變數,存在於函式執行時,只能在函式內的程式區塊使用。
    全域變數(Global Variables)
    變數在函數外宣告,整個JavaScript程式的函數和程式碼都可以存取。

    資料型別(data type)





    未定義(undefined)

    某段資料未初始化,或沒有值

    空(null)

    不是字串的"",數字的0,布林的false,空就是空,代表一種空狀態。

    布林(boolean)

    true(成立)與false(不成立)

    字串(string)

    文字(text)資料只是一串字元,通常出現在單/雙引號之間

    數值(number)

    數字資料,未出現在單/雙引號之間的阿拉伯數字

    物件(object)


    參考(reference)

    var check = function(evt){...};

    列表(list)

    完成(completion)
    JavaScript基本資料型別,布林(boolean), 字串(string), 數值(number);JavaScript會在你設定資料時,自動判定型別,自動指定,我們無法在設定變數時設定資料型別。

    關鍵字

    • break
    • case
    • catch
    • continue
    • default
    • delete
    • do
    • else
    • finally
    • for
    • function
    • if
    • in
    • instanceof
    • new
    • return
    • switch
    • this
    • throw
    • try
    • typeof
    • var
    • void
    • while
    • with

    保留字

    • abstract
    • boolean
    • byte
    • char
    • class
    • const
    • debugger
    • double
    • enum
    • export
    • extends
    • final
    • float
    • goto
    • implements
    • import
    • int
    • interface
    • long
    • native
    • package
    • private
    • protected
    • public
    • short
    • static
    • super
    • synchronized
    • throws
    • transient
    • volatile
    保留字一般較少使用,在物件導向程式設計中使用率比較高。

    比較符號

    比較符號 說明
    == 等於
    != 不等於
    > 大於
    < 小於
    >= 大於等於
    <= 小於等於
    === 絕對等於
    !== 絕對不等於
    雙等號運算子(等於)會進行型態強制轉換,假如比較的資料型態不一樣,有時結果會相當有趣:1 == true會得true。要避免型態強制轉換,要用三等號運算子(絕對等於),例如,

    1 === true會得false,還有一個!== (絕對不等於)運算子。

    邏輯符號

    邏輯符號 說明
    && And運算
    || Or運算
    ! Not運算

    CSS -- 中英文字型家族相關整理

    英文字型家族

    1. Sans-serif家族
      Sans-serif家族都沒有截線可讀性較高。
      • Verdana
      • Arial Black
      • Trebuchet MS
      • Arial
      • Genev
    2. Serif家族
      Serif家族都有截線,比較像印刷體
      • Times
      • Times New Roman
      • Georgia
    3. Monospace家族
      Monospace家族字母寬度都一樣,適合顯示軟體程式碼之類。
      • Courier
      • Courier New
      • Andale Mono
    4. Cursive家族
      Cursive家族像手寫,適合「標題, h1~h6」之類。
      • Comic Sans
      • Apple Chancery
    5. Fantasy家族
      Fantasy家族像裝飾性風格,但非每台電腦都有,網路上較少使用。
      • LAST NINJA
      • Impact

    Windows or Mac?

    Windows and Mac可能都有的字型:
    • Andale Mono
    • Arial
    • Arial Black
    • Comic Sans
    • Courier New
    • Georgia
    • Impact
    • Times New Roman
    • Trebuchet MS
    • Verdana
    Mac可能有:
    • Genava
    • Courier
    • Helvetica
    • Times

    Google Font API

    Google Font API是Google所提供免費的英文字型。可線上載入及使用。

    正體中文字型家型

    中文字型的選擇就少很多,因為我們使用在網站上,主要目標還是Browser,假設你使用了「華康字型」,網路上其他人的電腦沒有此字型,也是白搭。所以就中文字型而言,在簡體或正體中文網站,就簡單多了,除非Microsoft會透過Microsoft Update去更新字型給所有Windows用戶,不然還是不要想太多,你沒什麼機會在網頁裡就中文字型動什麼花樣。

    以大眾市場而言,正體中文就「"標楷體", "細明體", "新細明體","微軟正黑體"」四種,沒了;"微軟正黑體"還算比較新的字型,也不一定所有正體中文電腦都有,所以說是三種也行。

    2010/12/07 補充--正體中文及簡體中文font-family設定

    /* for China */
        font-family : "宋体", simsun, nsimsun, "黑体", simhei, "楷体", simkai, "仿宋", simfang, Arial, Verdana, "Trebuchet MS", sans-serif;
        
        /* for Taiwan */
        font-family : "新細明體", PMingLiu , "標楷體", DFKai-sb , "細明體", MingLiu , "微軟正黑體", "Microsoft JhengHei" , Arial, Verdana, "Trebuchet MS", sans-serif;
    

    2010/12/27 補充--OS及軟體包含字型查詢網址

    1. Microsoft Typegraphy
    2. MAC OS X:Fonts list

    Microsoft AntiXSS Library 3.1 Upgrade 4.0

    如果你的網站有讓人家「輸入資料」,那必須非常小心的處理,在以前,我們必須寫很多檢查程式,前面javascript檢查一遍,後面再用VBScript(ASP)或Visual Basic(ASP.NET)再檢查一遍,反正這種檢查永遠不嫌多。

    一般而言,為了要保護好網站,所以這種檢測、檢查的程式就可以寫很多很多,在ASP.NET最簡單的方式就是拉Validator控制項,如果更進一步就寫些JavaScript來加強,但一山還有一山高,總是有人有得出辦法去過去,不然SQL Injection、XSS…都已經出現多少年,還是有一堆網站被它們打敗,你可以看看「XSS (Cross Site Scripting) Cheat Sheet」或「Ultimate XSS CSS injection」這裡面的功擊情境,Try it,你寫的檢測Code能防的了幾種,我是看的頭都花了。

    再來,寫JavaScript有個壞處,就是你的處理方式,只要懂的人就能把你的JavaScript內容看光光,知道了你的處理方式,我們就能開始設計跳過你處理方式的方法。ASP.NET的Validator控制項是不錯,但Validator控制項只合適用來檢測一些簡單的需求,如果複雜些的,那Validator控制項還是不好用,不相信,簡單,一樣使用Validator控制項去檢測上面那些攻擊情境的內容看看。

    那Regular Expression呢?不多說,這是張王牌,但使能用它的人,必須有很好的內功,不然你是練不了它的。

    後來發現了一個非常好用的函式庫「Microsoft Web Protection Library」,我是從AntiXSS Library 3.1版開始使用,此函式庫不得了,AntiXSS Library會幫你進行內容過濾的動作,將有害的內容剔除與替代,給你一個受保護的環境。在AntiXSS Library 3.1就能保護我上面所提「XSS (Cross Site Scripting) Cheat Sheet」與「Ultimate XSS CSS injection」的所有攻擊情境,這讓我們用起來安心,用起來爽歪歪。

    我不敢保證,AntiXSS Library能100%保護我們不受功擊或不讓功擊成功,但最少基礎上的保護,別人如果是70分,你使用AntiXSS Library後,我們會加到90分以上,所以我極推薦AntiXSS Library。想像是幫「網站」裝防毒軟體,有裝有保佑。

    Microsoft AntiXSS Library 3.1 Upgrade 4.0

    在更新AntiXSS Library 3.1 DLL檔至4.0版之後,發現一些內容上的差異,在Visual Studio 2010中,會提供原先使用AntiXSS Class過時的訊息,查了一下4.0的手冊,還直的沒有AntiXSS的內容,取代的是Sanitzer Class(Sanitzer,清潔劑,取的真好),用法與AntiXSS一樣,Sanitzer.GetSafeHtml()、Sanitzer.GetSafeHtmlFragment()。

    加入Microsoft AntiXSS Library 4.0參考

    在專案或網站的「Bin」目錄下,按右鍵選擇「加入參考」,選擇「瀏覽」,找到安裝Microsoft AntiXSS Library的目錄,一般是在「...\Microsoft Information Security\AntiXSS Library v4.0」之下(你可同時安裝3.1與4.0),你可以找到兩個DLL檔,AntiXSSLibrary.dll與HtmlSanitizationLibrary.dll,如果你有使用AntiXSS Library 3.1,要與舊版程式碼相容,那就參考新的AntiXSSLibrary.dll;如果你是要使用AntiXSS Library 4.0功能,那就參考HtmlSanitizationLibrary.dll,參考完在使用前先「Imports Microsoft.Security.Application」(Visual Base)、「Using Microsoft.Security.Application」(C#)即可使用。

    Sanitzer Class

    Dim s1 As String = Sanitizer.GetSafeHtml(tbxNamen.Text)
    Dim s2 As String = Sanitizer.GetSafeHtmlFragment(tbxName.Text)
    
    ' Encoder Class也是AntiXSS Library所提供
    Response.Write(Encoder.HtmlEncode(s1))
    Response.Write(Encoder.HtmlEncode(s2))
    

    我們輸入含Tag(<b> KKBruce </b>)的內容,我們看一下結果:
    <!-- s1的內容 -->
    <html>
    
    <body>
    
    <b>KKBruce</b>
    
    </body>
    
    </html>
    
    
    <!-- s2的內容 -->
    <b>KKBruce</b>
    

    我們輸入含Script Tag(<script> alert('Hello world!');</script>),我們看一下結果:
    <!-- s1的內容 -->
    <html>
    
    <head>
    
    </head>
    
    </html>
    
    
    
    <!-- s2的內容,空空如也,什麼都沒有,已經被過濾剔除 -->
    
    

    Sanitizer.GetSafeHtml()會傳回一個完整的HTML架構內容,而Sanitizer.GetSafeHtmlFragment()是就傳回你所傳入的內容。注意第二個含Script例子,它被AntiXSS Library 4.0認定為有害內容,所以就回傳一個「String.Empty」給你,這點與AntiXSS Library 3.1不同,如果你是使用AntiXSS Library 3.1 upgrade AntiXSS Library 4.0,這部份有所不同,請參考AntiXSS Library 4.0手冊。

    你可以繼續Try其他SQL Injection、XSS…等,你應該會得到很滿意的結果。

    結論是,愛它(網站)就要保護它,請多多利用這個免費Microsoft Web Protection Library(AntiXSS Library),有了AntiXSS Library你就不怕中標了。

    Microsoft ajax CDN Domain改名為aspnetcdn

    公司在China有網站,而網站內有引用jQuery,而為了節省一點點流量及加快載入速度,想必會使用Ajax CDN服務,而目前只有Microsoft及Google有提供這類Ajax Framework CDN服務,使用這類服務不錯,但只有一個技術上缺點首一個…怎麼說的缺點呢?

    技術上而言,我們在引使用必須將版本資料寫死,例如,
    http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4-min.js或
    google.load("jquery","1.4.4");,所以當版本有更動且你想升級時,那又是一件大工程,因為你必須將所有有引用的網頁找出,然後修改它。不過現在也還好,工具都寫得很方便,可以整個資料夾、整個專案的取代,也算還OK。

    另一個…缺點就是…China對Google不太友善,所以我採用China使用Microsft Ajax CDN,其他使用Google Ajax CDN,最少目前Microsoft在China還沒發生什麼會被封、會被鎖之類的事情,這是思考後所決定採用的方案。

    今天要更新jQuery至1.4.4版,結果發現Microsoft Ajax CDN的Domain已經改了,這是Microsoft的說明:

    ajax.microsoft.com renamed to ajax.aspnetcdn.com

    The CDN used to use the microsoft.com domain name and has been changed to use the aspnetcdn.com domain name. This change was made to increase performance because when a browser referenced the microsoft.com domain it would send any cookies from that domain across the wire with each request. By renaming to a domain name other than microsoft.com performance can be increased by as much to 25%. Note ajax.microsoft.com will continue to function but ajax.aspnetcdn.com is recommended.

    * Old Format: http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.4.js
    * New Format: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.js

    據Microsft說法,改使用新aspnetcdn能提升25%的效率,怎麼好!
    如果你有使用到Microsoft Ajax CDN服務,快快去修改,將ajax.microsoft.com修改或取代為「ajax.aspnetcdn.com」,一點點功夫就能讓網站更快更好些,何樂而不為!

    此外,Visual Studio的jQuery說明檔-vsdoc.js,從1.4.1~1.4.4都已經上線,Visual Stdio 2010引用一下,馬上就能查詢最新功能相關資訊。

    參考:

    Microsoft Ajax content delivery network (CDN)

    後置程式手寫SqlDataSource程式新增日期格式之錯誤產生及解決

    ADO.NET #3 (GridView + SqlDataSource)完全手寫、後置程式碼,兼論 SqlDataSource與UpdateParameter/DeleteParameter的用法

    在學習以上程式碼的過程中,不斷出現錯誤訊息,一直無法新增成功,但失敗為成功之母,也讓我在使用SqlDataSource1.UpdateParameters還有日期處理上有了多一分認識。

    在執行程式的過程,一直出現SqlDataSource.Update()有問題,錯誤訊息為「從字元字串轉換成日期及/或時間時,轉換失敗。」直覺是日期方面有問題,於是在日期資料上加了CData()轉換,但還是一樣,後來索性直接到MS SQL Server中去直接執行Update語法,發現在MS SQL Server中的錯誤訊息一模一樣。

    我在ASP.NET (.NET Framework 4)的GridView中,ASP.NET很好心會幫我們進行文化轉換,即原資料庫中資料為「2002-08-01 00:00:00.000」,但你在畫面上看到的是「2002/8/1 上午 12:00:00」,所以程式碼:

    ' my_test_time.Text = "2002/8/1 上午 12:00:00"
    SqlDataSource1.UpdateParameters.Add("test_time", my_test_time.Text)
    

    問題出在這裡,這個「2002/8/1 上午 12:00:00」格式MS SQL Server看不懂,所以我就很直覺加上CDate()

    ' CDate(my_test_time.Text)輸出還是"2002/8/1 上午 12:00:00"
    SqlDataSource1.UpdateParameters.Add("test_time", CDate(my_test_time.Text))
    

    結果…還是錯,CDate()輸出格式還是「2002/8/1 上午 12:00:00」也就是說,CDate()還是會依文化特性來轉換,所以我們加上格式化輸出:

    ' 輸出格式 = 2002/8/1 12:00:00
    SqlDataSource1.UpdateParameters.Add("test_time",CDate(my_test_time.Text).ToString("yyyy/MM/dd HH:mm:ss"))
    

    程式總算正常了。

    我在想,其他人為什麼沒碰到這個問題?我想比較可能的原因是MS SQL Server的版本不同,我使用的是比較新版MS SQL Server 2008 R2 (10.50.1600),所造成的結果。另外也可能是SqlDataSource1.UpdateParameters的小Bug,SqlDataSource1.UpdateParameters不像我們在使用像「SqlDataAdapter.UpdateCommand.Parameters.AddWithValue("@test_time", CDate(my_test_time.Text))」,SqlDataAdapter.UpdateCommand應該會自動幫你轉回正常的格式,讓MS SQL Server能接受,所以在使用SqlDataAdapter.UpdateCommand等相關程式時,也沒發這過這樣的錯誤,這部份我就沒深入研究。

    結果就是,使用SqlDataSource1.UpdateParameters請小心「日期的格式」。

    參考:
    日期和時間格式字串

    關於ATI AGP卡(About Ati AGP Card)

    我家裡電腦顯示卡是Asus AH3450,本來想裝Windows 7玩玩,結果什麼都能安裝,就是顯示卡的Driver裝不起來,找了Asus的客服及去Ati官網,都沒能解決我的問題,後來看到這一篇:

    Hotfix for “No compatible hardware found” error when installing ATI Catalyst™ drivers for ATI Radeon™ HD 4xxx, ATI Radeon HD 3xxx and ATI Radeon HD 2xxx series AGP products

    可以說Ati的Driver在某此Windows版本之後,會出現不支援AGP Card的問題,所以有人出了這個Hotfix版本的Driver,剛好AH3450是HD3xxx系列,但…很不幸,問題依然存在,所以bye bye Windows 7,你實在不合適舊PC上,雖然在無顯示卡Driver下,你運作的比XP還順,但我總不能一直等下去,所以我又回到XP的懷抱。

    華碩雲端硬碟空間軟體使用方法( ASUS Web Storage Software Use Method)

    前一篇「華碩雲端硬碟(Asus Web Storage)」我們談到如何申請帳號及基本的使用,首先,我們申請好Asus web storage帳號後,接下來我們來看看如何使用Asus Web Storage各項功能。

    先下載軟體安裝於本機,我下載「ASUS WebStorage for Windows」然後安裝後,啟動軟體,我下載的是3.0.52版。

    MySyncFolder

    MySyncFolder


    這一個上次有介紹過了,主要為做「登入」與「資料夾同步」,它的運作很簡單,假設你有A,B,C三台電腦需要進行資料同步,以前最方便是就拿USB隨身碟,把資料各copy一份到A,B,C,但時間一久,你就會發現怎麼A電腦有的資料,B電腦沒有,C電腦有的資料,A、B電腦又缺了那一份。

    這時你就會發現MySyncFolder的好用,只要你在這三台電腦都安裝好Asus web storage軟體,使用相同的帳號密碼登入後,嘿~嘿~嘿~,這個Asus Web Storage軟體就會自動幫同步你所設定資料夾下所有檔案資料,你就不用怕找不到資料,更重要的是,你所有的資料還能透過Web來存取,你可以按最右邊的「Go to Web」,它會幫你自動登入Asus Web Storage:

    MySyncFolder UI


    在Web UI上,你能針對檔案或是資料夾進行「權限設定」,透過最旁邊的下三角形:

    Share

    分享設定


    我們選擇「分享設定」,經過分享設定你就可以把此資料夾或檔案分享出去給Internet上所有人。所以請小心,重要或機密資料,不是透過這一個設定分享出去。

    Beging Share

    當我們按下「開始分享」就會產生:

    Share Information

    這樣就會產生分享網址,你可以點http://oeo.la這一個試試看:

    oeo.la share UI

    這裡重要的設定只有「設定分享密碼」,即如果你只是要分享給特定人士,而非Internet上的大眾,請記得一定要設定密碼!切記,切記!

    群組分享夾


    在剛才分享設定中,可以把資料夾設定為「群組分享資料夾」,也就是都有在使用Asus Web Storage的使用者,如果你知道對方的帳號或Email,你就可以互相申請加入為好友,然後就有一個專屬於這些好友的分享空間。

    Group share

    Calender


    Asus Web Storage -- Calender

    「行事曆」的同步,

    Calender UI

    也就是能幫你同步各電腦之間的行事曆,不過目前還無法從網頁上看到同步後的行事曆,這一點就Outlook或Google日曆方便些,不過我相信會有那一天。

    BookmarkSyncer


    它會同步各台電腦中的瀏覽器「我的最愛」書籤:

    BookmarkSyncer Setting

    雖然我們失去了xmarks,但我又找到新歡了,無論你是要同步Internet Explorer、Google Chrome、Mozilla Firefox通通沒有問題,真的要為Asus web storage好好加分一下才行。

    MobileApp

    Mobile App

    如果你有使用智慧型手機,可以把相對應的軟體(iPhone, iPod Touch, Android)抓回來安裝後,即可與智慧型手機進行同步的工作。

    Mobile App Client

    Backup


    Backup

    顧名思義,即備份電腦的資料,這比較是「單機備份」,非同步的功能。你能備份A電腦的「工作進度」資料夾,B電腦的「女兒的照片」、C電腦的「ProjectCode」,這裡是一個重點,如果你是付費用戶,Asus web storage是不限空間,也就是說你可以把你所有的資料全部全陪都進行備份的動作。

    設定初次備份條件

    備份狀態

    設定備份條件

    設定你要備份的資料夾或檔案,加入後Asus web storage會自動幫你備份。

    備分--進階設定

    排程備份

    也就是你要多久備份一次至Asus web storage,自動備分是指當資料夾有異動,它就會自動進行備份動作。

    Backup Web UI

    Backup Web UI Folder

    在Web找到「已備份的項目」,你就能找到各電腦所備份的資料。

    Drive


    Drive

    Drive是可以直接透過本機的「檔案總管」去直接存取Asus Web Storage的資料,這可以讓我們很方便存取我們想要資料,而不必再去開啟網頁,東點西連。

    Drive --  MySyncfolder

    Asus Web Storage軟體部份介紹到此。前面有依功能介紹一些Web上的功能,但接下來才是Web上的殺手級應用。

    多格式之閱讀


    當你把檔案上傳至Asus web storage後,你還能在Asus web storage裡直接「閱讀」或稱「預覽」,

    .docx format

    我測試的結果,只要它能讀的出來的格式:xls、doc、ppt、txt、jpg、pdf、Office Open XML(Office 2007/2010)…都能在Asus web storage上讀出,但它只能把內容中的文字資料,但我覺得厲害的是,文字排版不會亂七八糟,依然可以很輕鬆看下去。

    全文檢索


    這可不是開玩笑。
    當我們資料檔案一多時,使用搜尋是最方便的方式,但Asus web storage不只是搜尋,而且是提供全文檢索,也就是可以搜尋到上傳資料檔案中的內容,這可以讓我們更快速找到我們要的資料。

    索引建立中…

    第一次使用全文檢索,Asus web storage會建立索引,所以必須等一會兒,依資料量的大小,時間不等(不會太快),你可以睡前來建立^_^。

    客服


    再來,Asus web storage的客服也不錯,有問題,回信速度快,也另外讓我學到一招,如何快速開始AppData資料夾,以下是客服會要你進行的動作:


    1. 請打開ie 在網址列輸入%appdata%
    2. 進入ASUS WebStorage 資料夾
    3. 進入LOG 資料夾
    4. 把LOG的內容複製並壓縮寄給我們

    如果你要提問,必須到「用戶服務-->用戶中心-->FAQ」(請先登入),最上方有個「提問」,再依你的問題輸入資料,輸入後再上傳Log即可。

    結論


    這一套由台灣國內廠商Asus所出Web Storage,我用了相當高興,終於有讓我用了也會高興的「台灣貨」。如果你要發揮100% Asus web storage的功能,必須與Asus web storage所提供的軟體結合,才會有更好的表現。相信假以時日,應該能有不錯的成績。讓我們大家一起來支援。

    相關文章:
    華碩雲端硬碟(Asus Web Storage)

    影音轉檔軟體整理

    自從買了那台Garmma G70 MP5之後,目前來說,影片、照片、音樂是使用率最高的三個,而且最大的好處是「分享」容易,在以前,我們出去玩後,但想與家人、朋友分享照片,雖然可以透過網路,但總是沒有「互動」「笑聲」,而且又不是每個人都會使用電腦、網路。

    沖洗出來,可,不錯!但影片(Movie)類怎麼沖洗!隨身帶台Notebook?有了MP5之後,真的好方便,薄薄一片拿出來,分享影片,沒問題,分享照片,沒問題。

    但有問題困擾我,就是看影片時,有些影片是直的,有些是橫的,在MP5看還沒有什麼問題,可以手動換個方向即可,但TV Out後,只好自己的「」來換個方向,這是第一個。第二個,像機錄影都是使用AVI檔,這個格式檔案太大,很傷HDD空間,所以就必須借助一些工具的幫忙。

    在影音轉檔部份,如果是格式轉換,例如AVI轉MP4、AVI轉RMVB…之類,這種免費軟體很多,功能與使用大多很方便,但因為我要幫影像「轉方向」,含這部份功能的免費軟體就少了些。

    #1 線上轉檔:如果你家中電腦和我一樣,舊舊的,跑的慢慢的,那簡單格式轉換就合適使用這種方式,例用一些線上網站提供的格式轉換功能,來幫你進行格式轉換的工作。缺點只有你上傳頻寬要大且快,不然上傳大檔案…等的時間還真久。


    http://www.online-convert.com/
    轉換格式多元,影、音、文件…等。

    http://www.clipconverter.cc/
    可直接將各影音網頁的影片檔,轉換為指定格式後下載。

    這兩個網站各有強項,我就不多介紹了。

    #2 格式轉換:利用免費軟體來進行檔案格式轉換的工作,先介紹沒有轉向功能,再介紹有轉向功能。

    無轉方向功能:
    http://www.garmma.com/tw/downloads/WinAVI9.0.rar
    garmma官網提供的工具(含破解),簡單使用。

    WinX HD Video Converter Deluxe
    可得免費序號,不保證還有免費序號,點看看還有沒有。支援格式相當多,但無rmRM(rmvb)相關格式。

    WinAVI 10.x 及WinX系統都要付費,但可以拿到免費的來使用,為什麼不用。

    有轉方向功能:
    http://www.formatoz.com/
    格式工廠,對岸寫的軟體,2.50版安裝後在功能表會出現亂碼,但使用起來正常。特效只能「設定」無法「預覽」,但格式支援完整。

    http://www.any-video-converter.com/products/for_video_free/
    使用簡單,且可以直接抓取影音網站的影片檔,轉換為指定格式後下載。特效可以先「預覽」,這對我來說是重要的功能,但它不支援RM(RMVB)相關格式。

    目前而言,轉成MP4及RMVB都是不錯的選擇,比較新的MKV相容性還不是很好,如果你有需要在TV播放1080p畫質的電影、影片,可以試試MKV,我試過G70內附MKV 1080p檔來播放,畫質細膩,Good!不過前提是你的Source畫質要高,例如DVD等級才MKV有用。

    ps.. Garmma G70 MP5有bug,在瀏覽圖片時…很難找到想看的圖片,經反應…沒人理我。@_@

    選一個安全的DNS伺服器

    我的工作內容有一部份與DNS有關,所以會常常關心有關DNS的消息,最近看到這一篇:「百萬台路由器陷入危機…」,裡面有提供一份資料:


    介紹請看這篇, 重點是,為什麼這麼重要的工作,不是由ISP來進行,例如Hinet…等!

    你們家裡還在使用「168.95.1.1 / 168.95.192.1」當DNS伺服器,我建議改成使用以上三個的組合,例如「8.8.8.8 + 208.67.222.222」或「8.8.4.4 + 208.67.220.220」,如果你不確定要使用那兩個組合,在Google網站中,有提供「namebench」的效能測試工具,把上面6組IP全部輸入,然後nanebench就會分析結果給你看,從結果中選擇最好的兩個來使用。

    這些第三方DNS伺服器,最少能提供額外安全過濾功能,讓你在上網的同時能更放心些!以下是我電腦測試結果:http://namebench.appspot.com/id/2159001,除了以上6台的IP,我還加上Hinet的那兩台,測試結果是「Google + Seednet」,好像怎麼測試Google都會是"第一名"!

    峇里島(Bali)入境表格及消費價格參考表



    以上是旅行社提供的價目表,有些價錢差不多,像租車、愛之船…可以當成參考資料。

    入境必須寫二張表格:

    第一張:以家庭為單位,寫一張即可。

    正面


    背面

    全部選No,如果有Yes,我也不知道怎麼辦!

    第二張:每人一份,絕大部份抄Passpost。

    正面

    背面

    其中「ACCOMODATION,處住」的英文應該是打錯了,應該是「ACCOMMODATION」少了一個M。

    我會特地多拿一份是因為,在機上寫的時候,有些看不懂意思,其實看不懂可以Call美美的空姐來幫忙,但婆婆在旁邊,又不能要電話,所以還是…自己用功。未來希望能常有出國的機會,所以這些表格是最好的教材,拿回來自己K,也分享給各位,先看看,不懂的查一下字典,它只問一些很簡單的問題。

    另外For Official use的簡寫,我查不到意思,我也就沒勾選了。(照字面,應該是給官員們勾選的)