當你你想進入某個 Bin 的編輯畫面時，會依據不同人的 JS Bin 設定，預設會開啟的這 5 大窗格都不太一樣。如果你今天想分享某個 Bin 給對方，又希望對方預設只開啟 HTML 與 JavaScript 窗格的話，則可以將網址稍微修改一下即可，例如以下 Bin 網址：

我們可以把網址修改成以下這樣 ( 在網址最後面加上 Query String 並用逗號分隔 )，再把該網址傳給對方，對方就照你的意思開啟 HTML 與 JavaScript 窗格：

這五大窗格分別代表的參數名稱如下：

4. 啟用 JavaScript 的括弧對應高亮

由於 JS Bin 使用 CodeMirror 套件當作 JavaScript 編輯器 (這套超強)，所以如果你想客製化調整 JavaScript 編輯器是有可能的，只要參考 CodeMirror 的 API 文件即可。這裡我介紹一個不錯的選項設定，也就是啟用 JavaScript 的括弧對應高亮功能。

我們以這個 Bin 為例：

我們必須在瀏覽器開發者工具的 Console (主控台) 頁籤執行以下指令，請開啟瀏覽器內建的開發者工具 ( IE8+, Chrome, Firefox, Safari 通通都有這類工具 )，並切換到 Console 或 主控台 頁籤，接著輸入：

jsbin.settings.editor.matchBrackets = true;

之後請按下 F5 (重新整理網頁)，擬將鍵盤游標移至同一個大括號的地方，就會發現有高亮顯示了：

5. 重設 JS Bin 開發環境

目前這一版 JS Bin 如果你執行了主選單的 Save as template 功能，很可惜的你就回不去了！意思就是你無法回復到網站內建預設的 HTML 樣板。還有如果你對編輯器調整了太多設定，導致無法正常使用的話，其實你是可以重設 JS Bin 開發環境的，此時你可以使用以下技巧。

註：這個一樣是沒有文件的密技，這技巧我研究好幾個小時才弄通呢！

開啟瀏覽器內建的開發者工具 ( IE8+, Chrome, Firefox, Safari 通通都有這類工具 )，並切換到Console 或 主控台 頁籤，接著輸入 delete jsbin.settings 並按下 Enter 執行，執行成功即可重設所有設定。

delete jsbin.settings

不過，還有 html / css / javascript 的 templates 內容也要清除，因為 JS Bin 把這些 templates 儲存在瀏覽器的 localStorage 裡面 ( 這是 HTML5 的一個儲存機制 )，這時還要輸入localStorage.clear() 才能徹底清除這些殘留的資料。

localStorage.clear()

執行完成的畫面如下，執行完後按下 F5 (重新整理) 即可回歸最初預設值！

6. 僅輸出 JavaScript 內容 ( 好讓另一個 Bin 透過 AJAX 載入 )

我們以  為例，我輸入一個純 JSON 的 JavaScript，你也可以從這邊看到好幾個 JSHint 的警告訊息，不過我們先不用理他。

{ "author": "Will", "bookname": "ASP.NET MVC 4 開發實戰" }

注意: JSON 中的字串，必須用「雙引號」括起來！

這時我們再建立另一個新的 Bin，並加入 jQuery 函式庫 
( 註: 這時因為 HTML 內容被改變，所以會被立即賦予一個 Bin ID，產生一個全新的網址 )

此時，我們把剛剛的網址稍微改一下，把 /edit 修改成 .js 即可取得 JavaScript 的部分而已，如下：

然後輸入以下 jQuery 程式，試圖測試 jQuery 的 AJAX 功能：

$.ajax({ url: ‘‘, dataType: ‘json‘, success: function(data) { alert(data.author + ‘ - ‘ + data.bookname); } });

如果你可以看到跟我一樣的畫面，代表我們透過 $.ajax 取到的的確是個 JSON 物件！

JsBin[使用教程]

标签：des   blog   http   io   os   ar   使用   java   strong