SQL Server 2008匯入資料

我需要台灣郵政資料，所以上去中華郵政，現在中華郵政很不錯，有提供電子檔或軟體給大家下載使用，而我需要在資料庫建台灣郵政資料，而中華郵政有提供3碼與5碼郵政資料電子檔，所以就下載回來。

中華郵政下載頁

原先我很呆，因為以前的SQL Server Express版本，記得是沒有匯入功能，想要使用匯入功能，那可是要花$.$，而我也沒想那怎多，處理的方法有二，一是寫段程式，將Excel檔的資料轉存到SQL Server中，二是，建好資料表及資料欄位，然後用「Copy & Paste」的古老方法，因為想快點完成功工作，所以我選擇了方法二。

結果，沒用沒事，用了看起來是最快的方法，結果速度奇慢無比，在從Excel copy to SQL Server過程裡，SSMS完全無法動作，而且Paste速度奇慢，只能看到畫面下面新增成功的資料數一筆一筆慢慢的增加，但Excel中有58865筆資料，Paste一次約要40分鐘以上，天呀~是給我時間泡Coffee，看報紙嗎？

不行。

找了找，試了試，答案原來那麼簡單。先說答案，再來看操作。答案就是，SQL Server 2008 Express支援匯出、匯入功能。原本搞了一下午的工作，在短短的數十秒內被秒殺~秒殺~秒殺~秒殺~秒殺~秒殺~秒殺~秒殺(看了好爽，再多看幾次)。

這次的經驗也讓我學到，以前沒有不代表現在沒有，以前有的也不代表現在會有。把每一次當成全新的開始，好好的學習。

接下來我們看看操作。

我們把台灣郵政資料匯入範例資料庫Northwind：

1. 先下載台灣郵政資料(3碼、5碼隨便)，解出Excel(*.xls)檔案；
2. 在SSMSE → Northwind → 右鍵 → 工作；

我們選擇「匯入資料」→ 出現「匯入和匯出精靈」；

在「選擇資料來源」頁面：

資料來源：目前有17種資料來源可以選擇，常用的Access / Excel都有支援，看了好高興，資料來源下方面設定選項會依你選擇不同的資料來源有所不同。我們選Excel。

Excel連接設定：

Excel檔案路徑：選擇Excel所在路徑。
Excel版本：系統會自動偵測。
第一個資料列有資料行名稱。（依情況自行勾選，我們的實例中是不能勾選）

選擇目的地及設定驗證方式：

目的地不一定是SQL Server，也就是說，你可以使用SSMS工具來做資料轉匯的工作，我之前都是使用Access在做這方面的工作。(但我未測試)

指定資料表複製或查詢

我們可以選擇從資料表來匯入，或是寫SQL語法過濾後來匯入；

選擇來源資料表和檢視

選擇要預覽的資料表，然後按下預覽鈕；

執行封裝：也就是執行匯入工作；

成功執行訊息；

這就我們就完成了Excel to SQL Server資料匯入的工作。

真的是「快又有效」。

但有一點要注意，就是匯入的資料格式都是採預設值，如欄位的資料型態都是nvarchar(255)，還有欄位名稱是F1, F2, F3, F4，這些事後要記得修改。

順便看一下台灣郵政資料的Schema：

TaiwanPost(<ZipCode,nchar(5)>,<City,nchar(3)>,<Area,nchar(3)>,<Road,nvarchar(11)>,<Scoop,nvarchar(23)>)

微軟詞彙入口網站

微軟詞彙入口網站：http://www.microsoft.com/language/zh/tw/default.mspx

真是相見恨晚的感覺，這個網站把所有Microsoft所使用的詞彙統一整理起來，然後你可以使用它來比較各個詞彙在不同語言裡的翻譯或使用的不同。

例如：

英文詞彙：object
語言：選「中文(台灣)」
結果：物件
(還有其他很多資料...)

英文詞彙：object
語言：選「中文(中華人民共和國)」
結果：对象

一開始的頁面只能「英文-->其他」，但等進到查詢完成頁面，就能「其他-->英文」。

例如：

原文：巡覽
語言：中文(台灣)
譯文：英文
結果：

Nav 巡覽 Visual Studio
Nav 巡覽 .NET Framework
Pager&#0; 頁面巡覽區 .NET Framework
Pager&#0; 頁面巡覽區 Visual Studio
Navigate 巡覽 Visual Studio
Navigate 巡覽 .NET Framework
Navigable 可巡覽 Visio
Navigation 巡覽 Visual Studio
Navigation 巡覽 Unkown
Navigation 巡覽 Access

如果你在msdn或technet或其他關於微軟技術文件上有看不懂的地方，建議可以先上這個網站查查相對應的翻譯。

CSS margin值的設定

CSS margin

margin : 0;
/*一個值：代表上、下、左、右。margin : 0 0 0 0;的簡寫。*/
margin : 5 10;
/*二個值：值1：上下、值2：左右。margin : 5 10 5 10;的簡寫。*/
margin : 5 10 15;
/*三個值：值1：上、值2：左右、值3：下。margin : 5 10 15 10;的簡寫。*/
margin: 1 10 5 15;
/*四個值：值1：上、值2：右、值3：下、值4：左。*/

margin auto

margin裡的auto通常是拿來「置中對齊」使用。也就是我們將左右邊界值設定為「auto」，讓它產生置中對齊的效果。

/*方法一*/
margin-left : auto;
margin-right: auto;
/*方法二*/
margin : auto;
/*方法三*/
margin : 上下 auto;
margin : 0 auto;
/*方法四*/
margin : 上 auto 下;
margin : 0 auto 0;

簡易Menu導覽(巡覽)列加文章下拉效果

我要來實作一個簡單的Menu導覽(巡覽)列。

一、先首我們準備好HTML內容：

<!--巡覽列-->
    <div id="navigation">
        <div id="container">
            <ul id="firstul">
                <li id="home" class="active"><a href="#" title="Home">首頁</a></li>
                <li id="news"><a href="#" title="讀書心得" id="mynews">讀書心得</a></li>
                <li id="about"><a href="#" title="有關我" id="about_us">有關我</a></li>
            </ul>
            <div id="mypage" style="display: none" align="center">
            </div>
        </div>
    </div>
    <!-- 文章：預設只顯示標題 -->
    <div id="content">
        <span id="title01">數位式競爭--讀書心得</span><br>
        <div id="title01_content" style="display: none;">
            這本書為民國89年出版，已經在我書架上很多了年，是我讀大學時的教科書，老師花了一個學期就只上這本書，當時讀起來沒什麼感覺，頂多只是為了交報告而讀，但很奇怪，它就是一直在我的書架上，雖然十多年來，書架上的書已經換了好幾回，尤其是資訊類的書，換的速度之快連我都怕，不過一本好書一定有存在的價值，不會因為時間的變動而有任何改變。我每天可以說都在與技術文件為「舞」，只是不知是我看它跳還是它看我跳。就這樣有一天，不知為何，好像「它」在跟我招手，然後說，來看看我吧，離上次你讀我已經是九年多前的事了，我能給你一些「明牌」！古人說：「不經一事，不長一知。」你沒有經歷過的事，說再多感受就是有限。但九年後的今天重讀本書，真是感受良多，這本書應該是十年前版的「由A到A+」。我一直很佩服國外的研究學者，能花那麼多時間、精神來研究出原本為「隱性」的知識，讓想要更上一層樓的人可以有方法可循。看完這本書後，讓我心有戚戚，十多年前的故事，現在每天還是在不斷重覆發生，不管是成功的故事，還是失敗的故事。我想這可能是知識的傳遞、了解到最後的落實還有很大一段差距。如果你從事軟體相關產業，而還沒有看過這本書，我非常建議你買來看看（我不知道還買不買的到)。
        </div>
        <span id="title02">The Last Lecture -- 讀書心得</span><br>
        <div id="title02_content" style="display: none;">
            「最後的演講」，是一位父親留給孩子的遺言。沒錯，是遺言。聽起來是個不好的消息，但也因為是遺言，所以他必須認真思考要留下什麼給他的孩子們，他晚婚，他小孩都還小，他有成就，他患癌。最後的演講分為兩個部分，一是演講影片，二是書本。我是先看書再看影片，影片的部份，你可以搜尋「朱學恆」在他的部落格裡有影片檔和中文字幕，影片是免費的。這場演講為什麼會是全世界轟動？我想，除了是作者蘭迪．鮑許（Randy
            Pausch）本身在面對癌症時還能散發不可思義的"樂觀"魅力，還有一種「人之將死，其言也善。」的人生智慧在裡面。人生有方向，是多麼重要及快樂的一件事，首先，是完成自我的夢想，然後是啟發他人的夢想，還可以進一步幫助他人完成夢想。這是Randy教授最後想跟我們說的話。反之，也就是人生一定要有「目標」、要有「方向」，要知道你自己的「路」在那裡。這或許是我喜歡讀些哲學類的書籍關係，思考一件的事的角度之多，或許不是你能想像的，提高看事的高度，提高做事的層度，努力的成就自己，但也不要忘了幫助別人，造成一個良性循環的社會。
        </div>
        <span id="title03">Word of Mouth Marketing--讀書心得</span><br>
        <div id="title03_content" style="display: none;">
            我的信箱中有許多的電子報，每天上班第一件事就開打開信箱，確認一下有沒有重要人士的信件，看看Log信件，看看電子報，其實訂了那怎多的電子報，絕大部份都在1-10秒內被我的食指結束生命，快快的按下那Delete鍵，然後Next。而某天的一封電子報裡刊載的標題讓我有興趣「掃」一下，看完後(很少有認真看完全部)，內容簡潔但又不失內容，後來又收到幾期的內容，一樣，都是很直接也實用的內容，文筆也不會看了想睡覺。這些電子報其實也是行銷手腕的一種，精選幾段精彩的內容，吸引你的注意，如果你也確實被吸引，但因為你只是看到部份的片面，這時就要看這些精彩的內容是否有足夠的吸引內，讓你採取行動，拿出新台幣去換一本有完整內容的書本。而我，被打動了。雖然我不是行銷人員，但我對行銷、管理方面的知識算很有興趣，一樣是動腦的工作，但行銷、管理和程式就是不同。而作者除了提供大量免費實用的做法外，也提供簡單的5個步驟打造好的「口碑」。
        </div>
    </div>

• 巡覽列：我們先使用ul及li元素配合CSS來做UI的工作。
• 文章：一開始只會顯示標題，使用者點選標題，才顯示文章內容。

二、巡覽列之CSS

/*ul元素設定*/
#navigation ul
{
 list-style-type : none ;
 margin : 0 auto; /*置中*/
 padding : 0;
 width : 850px;
}

/*讓li"浮"起來，變成"橫向列"*/
#navigation li 
{
 float : left ;
}

/*Menu中a元素設定*/
#navigation a 
{
 float : left ;
 display : block ; /*以「區塊」元素方式顯示*/
 color : rgb(197,197,197);
 padding : 5px 8px;
 margin-top : 10px;
 border-bottom-width : 0;
}

/*li中類別為active的a元素設定*/
#navigation li.active a
{
 color : rgb(255,204,0);
 background-color : rgb(153,153,153);
}

/*Menu中a元素:hover及:active設定 */
#navigation a:hover, #navigation a:active
{
 color : rgb(204,204,255);
 background-color : rgb(100,90,125);
}

/*文章區塊，<div id="content">設定 */
#content
{
 clear : both ;
 width : 850px;
 margin : 0 auto; /*置中*/
 padding : 0;
 background-color : rgb(193,189,204);
}

/* 文章標題，讓jQuery動態加入 */
.newstitle
{
 color :Black ;
 border-bottom : 1px dotted gray;
}

/* 文章內容，由jQuery動態控制  */
.newscontent
{
 width : 50%;
 color : Black ;
 background-color : rgb(255,153,51);
 border : 1px dotted gray;
 padding : 7px 30px 10px 25px;
}

建議一段一段複製，看整個畫面變化的過程，才能了解為什麼這樣設定。

三、jQuery程式碼

再來就是jQuery來設定文章標題樣式及文章內容顯示部份：

$(function() {
    $("#firstul li:eq(0)").removeClass("active"); //先將"首頁"的類別移除
    $("#firstul li:eq(1)").addClass("active");  // 將"讀書心得"設定.active類別
    $("span[id]").addClass("newstitle"); // 文章標題設定

    $("#title01").click(function() { //點擊標題時，
        //文章內容加入.newscontent類別設定
        $("#title01_content").addClass("newscontent").toggle("slow"); 
        //其他非title01的內容，全部hide()
        $("div[id^=title]:not(#title01_content)").hide("slow");
    });

    $("#title02").click(function() {
    $("#title02_content").addClass("newscontent").toggle("slow");
    $("div[id^=title]:not(#title02_content)").hide("slow");
    });

    $("#title03").click(function() {
    $("#title03_content").addClass("newscontent").toggle("slow");
    $("div[id^=title]:not(#title03_content)").hide("slow");
    });
});

這樣我們就完成了一個起簡單版的Menu巡覽列(CSS實作)加上切換文章內容功能(jQuery)的網頁。程式還有很多改進的空間，加油！

得知使用者按下按鍵代表的意思

HTML

<div id="myform">
Name:<input />
Email:<input />
</div>

jQuery(1)

$(document).keydown(function(e){
  //keyCode為ESC
  if (e.keyCode == 27) {
  $("#myform").hide("slow");
  }
});

我們透過document來為網頁注冊一個keydown事件，如果使用者focus在網頁上，然後由鍵盤有按下任何一個「鍵」，就可以由e.keyCode來得到一個數字，然後依這個數字，我們就可以寫對應的Code。

keyCode請參考：http://unixpapa.com/js/key.html

另外，我也能使用JavaScript中String物件的fromCharCode方法來得到文字內容，而不是數字。

JavaScript

function keyText(e) {
            // e.which 取得keyCode的數字
            // String.fromCharCode將keyCode轉換成對應的文字
            if (window.event) // IE
            {
                keynum = e.keyCode
            }
            else if (e.which) // Netscape/Firefox/Opera
            {
                keynum = e.which
            }
            alert(String.fromCharCode(keynum) + ":按鍵被按下了");
            return true;
        }

        document.onkeydown = keyText;

但以上JavaScript程式在IE8上會有問題，這也顯示出來一個重點，jQuery在跨Browser上的處理能力比傳統的JavaScript好上許多。如果你是資深的網頁程式開發人員就會知道這種痛，同一支程式，還要先去判斷是IE和非IE，是IE走A，不是IE走B，但有了jQuery可以大大減少這種不必要的幸苦路。

最後，我們再來修改一下jQuery程式，顯示一下我們所按下的按鍵文字(0-9,a-z能正常顯示)，記得在IE及Firefox都測試看看。

jQuery(2)

$(document).keydown(function(e) {
　　alert(String.fromCharCode(e.keyCode) + ":按鍵被按下了");
　　//27為ESC
　　if (e.keyCode == 27) {
　　$("#myform").hide("slow");
　　}
});