跳到主要內容

發表文章

目前顯示的是 7月, 2011的文章

[教學] nodeJS直接module加載於windows native node

NodeJS 終於在0.5.1(unstable) 版本提供了Windows native supprot.,但是美中不足的部份就是childprocess的功能支援不完全,因此無法透過node.exe來 安裝npm 。 這樣子會造成很多遺憾,例如socket.io, redis, mysql等其他外掛模組都無法加載進來,本篇文章就是講解如何直接將這些外部module加載進來,不需要經過npm或者其他腳本語言安裝module。 設定環境變數 下載node v0.5.2 native windows 將node.exe放置到自己的資料夾中(這邊預設為 c:\node )

[分享] 解決網頁長文字破版現象

網頁前端處理,最常碰到的事情就是『破版』,會因為樣式問題導致許多破版的狀況產生。這邊所提到的就是在 『英數連續長字串』 會發生的破版現象,並解說如何解決。 首先讓我們看一下怎麼樣的情況會破版。 前提,文字內容為英數連續長字串,在紅色div寬度限制下,會凸出來一大塊,這想必不是我們所樂見的,因此需要做些改進,這邊就介紹一下改進的方式。

[分享] Javascript 計算字元長度, count string length by javascript

今天遇到一個問題,很簡單的一個問題當有一個input box需要限制輸入長度,想當然很簡單在input 裡面加上一個maxlength屬性就可以完成限制,接著有另一個更大的問題,因為使用者從多個國家而來,我們需要接受,『中英輸入』的文字,那問題就出現了! 像是 Facebook album 就有這樣的問題存在,當我很開心的輸入了 一連串的國 ,直到不能輸入為止,再按下儲存,本以為 『國國國國國....國國國』 相簿應該會存在,可惜... 實際上後面卻給我出現外星符號,而且我剛剛輸入的『國國國....』應該是目前數量2倍之多啊,為什麼會這樣子,搞了許久發現問題在於,在PHP認定字串長度是使用byte來計算,並不是採用字元為單位。 前端頁面的算法,input box裡面,一個字為一個長度,在Javascript裡面也是,一個字就是一個長度,所以前端所看到的字串,丟到PHP之後又變成了第三度空間,內容都會被扭曲,尤其是尾巴的部份。 介紹將字串轉換為Byte 計算長度: "測試".length; // output : 2; "ab".length; // output : 2; 這樣子的結果似乎不是我們要得,所以我們決定轉換另一個方向,將所有字元長度都先轉換為byte code,之後再計算字元長度。 encodeURIComponent("測試"); // output "%E6%B8%AC%E8%A9%A6" encodeURIComponent("ab"); // output "ab" 轉換成 byte之後,感覺上就可以開始計算了, 一個中文可以切成3個byte,1個byte會呈現%dd ,就可以計算成一個中文字,將上面得到的字串長度再除 3 就可以得知目前字長度。 var str = encodeURIComponent("測試"); console.log(str.length /3); // output 6 乍看之下的確如此,但是 中英文 的情況會是如何!? 剛剛的結果很明顯長度為 6 ,如果在中間穿插3個英文,會是什麼狀況? var str = encod

[新聞] NodeJS換新LOGO, NodeJS change a new logo.

根據 官方說明 ,NodeJS將朝向品牌,為了這個目標建立了新的LOGO,提高NodeJS的辨識度。 針對這次新設計的LOGO邀請 Chris Glass ,為NodeJS設計新的LOGO,利用幾何圖學結構,來強調出Node,這個字樣,是活潑、有整體結構而且與彼此關係是緊密連結的。整個Node字樣,是基於拓普網路,將各個節點結合,形成緊密的網路型態。 目前官方提供了: 四種不同顏色LOGO (EPS原始檔) 桌布( 1024 x 768  |  1280 x 1024  |  1440 x 900  |  1920 x 1200  |  2560 x 1440 ) 歡迎到 NodeJS官方網站下載 !多種樣式任君挑選。 最後讓我們再看一眼早期的LOGO... [工商服務] NodeJS Taiwan 期待更多人的支持,希望能夠聽到你的回應及分享。

[教學] CSSLint 檢查CSS 安裝及教學. How use CSSLint

前端工程總是需要很多的工具搭配和經驗,Javascript 已經有套很好用的檢驗工具JSLint,而今天介紹的就是使用CSSLint,CSSLint顧名思義,就是用來檢查CSS的項目,當然裡面有許多檢查的範圍,這篇文章就不一一贅述。 CSSLint最棒的地方就是目前有直接線上網站檢查機制。這套工具是由 Nicole Sullivan , Nicholas C. Zakas 共同製作的工具同時也是放置 Github Open source專案 ,CSSLint檢查工具是搭配 NPM 所發展的CLI檢查工具,讓開發者編寫完CSS之後可以立即檢查,透過工具檢查機制,可以讓犯錯的機會降低,這就是工具發展的願景,更也是大家共同的目標。話不多說,直接看看怎麼使用CSSLint。 CSSLint: 線上網站 CSSLint Source code 檢查標準官方有列出所有檢查機制 安裝以及執行CSSLint: npm install csslint -global

[分享] NodeJS 如何使用EventEmitter 自訂事件

在 NodeJS 裡面,其實對於 EventEmitter 這個物件還蠻陌生的,甚至不知道它到底可以幫我做什麼。 其實它的功能主要可以讓事件觸發更為彈性。在一般瀏覽器當中Javascript 事件綁定通常使用addlistener,通常觸發事件範圍會有限,像通常使用的事件綁定,click, hover, focus, blur...,但是當我們想要自訂個觸發點為'explode',就會受限於此,因此EventEmitter ,這個物件就誕生了。 它的出現可以讓物件繼承EventEmitter ,用來綁定、觸發事件的發生點。畢竟NodeJS是一個後端的程式,需求通常會比前端的類型多很多,就來看看一下實際範例會怎麼使用。 測試程式碼: var EventEmitter = require('events').EventEmitter, bomb = new EventEmitter(); console.log("bomb event binding"); bomb.on('explode', function() { console.log('BOOM!'); }); console.log("bomb 'explode' event trigger"); bomb.emit('explode');