加jQuery進使用MooTools的頁面

手邊有一些網頁用到了MooTools，不過為了一些需求，需要加進jQuery
看過一些網頁資料，MooTools與jQuery有某種程度的相沖
實際在使用時，jQuery不管加在MooTools前面或後面，原來使用MooTools的功能就出問題
後來經過一些嘗試，把下列這段加在MooTools之前
<script type="text/javascript" src="lib/jquery.js"></script>
<script type="text/javascript">
var $j = jQuery.noConflict();
</script>

這樣$保留給原來MooTools用，而$j供jQuery使用

怪，IE8顯示的資料少了

今天遇到一件怪事，面對同樣的資料來源，IE8的呈現出來的資料筆數竟然與IE11, Firefox, Chrome不同

環境
這是個web-based的系統，browser以AJAX，透過XMLHttpRequest向server取得資料後，再以JavaScript呈現在頁面

問題
以現有的設定應該會顯示出3筆資料，在Firefox, Chrome與IE11都正確顯示，唯有IE8只顯示出一筆資料。

解決過程
用Chrome的development tool來看，responseText拿到的資料是
192.168.10.120/1/1##192.168.10.57/2/1##192.168.10.63/1/5
(我們是用"##"來做分隔號)
但在IE8中，responseText卻是
192.168.10.120/1/1## 
所以，問題就不是在javascript把資料呈現在頁面這段，而是資料來源了。而這就有點詭異了，因為在同一個時間點，這設定是不會變動的，IE8理應拿到的是跟其他browser相同的資料才對。難道IE8有問題？
直接用IE8連結資料源的網址，咦~~，拿到的資料是3筆呀。所以IE8從server拿的資料應該是正確的。那問題是在IE8的XMLHttpRequest把我的資料暗槓了嗎？應該不會才對，其他相同作法的頁面都沒事呀。

在百思不得其解時，突然想起用Wireshark來抓抓兩端間的封包看看，果然有了重大發現。server傳回來的responseText在Wireshark看到的是
192.168.10.120/1/1##\000192.168.10.57/2/1##\000192.168.10.63/1/5

在每個## (分隔號)的後面，都多了\000，也許就是因為這個，IE8的javascript engine解譯為octal null character，對null-terminated string來說，這就是字串的結束，所以把後面的都忽略了；而其他browser的javascript engine則是忽略掉這個null character，所以才有這樣的差別。

看來問題是在server-side的程式了。
查找了一下server程式，果然發現該程式(C language)在把分隔號##寫入response chunk，給的length竟然是3，難怪會多出那個null character。改正後就沒問題了。

結案！

datalist在Chrome跟Firefox的表現

HTML5的datalist在Chrome跟Firefox的表現還真是差別不小
以下面這個例自來看
<input list="states" />
<datalist id="states">
<option value="Kansas">
<option value="Missouri">
<option value="Colorado">
<option value="Nebraska">
<option value="Oklahoma">
</datalist> a

如果在input field中輸入 "o"，在Chrome與Opera中看到的是以o開頭的選項，而且有像select/option的下拉式操作

而在Firefox中所看到的，是選項中含有o這個字母的選項，且沒有下拉的三角形 (不過在input field中用mouse click，還是會有選項出現)