發表文章

目前顯示的是 十一月, 2013的文章

Fedora 或是 CentOS 中使用 MP3,MP4 等格式的解碼 codec

圖片
在 Fedora 中,一直以來都不會內建MP3,MP4等這些影音格式的解碼包,原因是因為這些解碼技術目前為止還是受版權保護的。
所以我們如果要可以在 Linux 中也可以看影片聽音樂的話,我們要先安裝解碼包。

不過既然這些是有版權保護的,我們用 YUM 的方式是沒有辦法安裝的,因為他的資料庫不會被收錄。所以我們要先把第三方支援的資料庫用 rpm 的方式建立進去。

sudo rpm -ivh http://download1.rpmfusion.org/free/fedora/rpmfusion-free-release-stable.noarch.rpm
接下來,當我們點選影片的時候他就會自動去下載到我們需要的 codec 了。



同場加映: 因為Fedora內建的那個影音播放器外掛字幕會當機,不知道其他人有沒有遇到這樣的問題。既然我們都已經裝第三方的軟體庫了,索性我也就順便裝上了 Mplayer 。
Fedora 預設的桌面版本是用 GNOME 作基礎,所以我們安裝的時候就是要安裝

yum -y install gnome-mplayer

防止使用者還沒有填完表單就離開頁面

圖片
當我們面臨到很大量的表單填寫時,常常會分心去點別的東西。或是重新整理(手怎麼這麼賤)。當然離開了以後表單的資料要重填也是天經地義的。我們可以做的事情就是先把使用者的動作先擋下來,然後跪下來懇求他~~~


這個畫面應該常常看到吧!其實這段很容易。

window.document.body.onbeforeunload = function()
{
    return '您尚未將編輯過的表單資料送出,請問您確定要離開網頁嗎?';
}
大功告成!

jQuery .bind() 和 .live() 重複綁定的解法 ~ on() 和 delegate()

jQuery 可以幫我們動態生成很多的 DOM 出來,但是由於生成後原先指定該物件動作的指令不會被重複執行,所以我們做出來的 DOM 內容並不會有動作產生。

這時候,我們通常都會使用 bind() 函式,或是 llive() 函式來進行重新綁定的動作,由於 live() 會偵測整個 Document 的動作,當頁面中有大量不相關的 DOM 時,會導致動作延緩。所以在 1.7 之後已經被拋棄。

而這兩個函式都有一個共同的問題,就是當我們不斷產生新的 DOM 時,會不斷的重複榜定函式,這絕對不會是我們要的。看下面:


在網路上面找了很多解法,有些說可以用 unbind() 解決,也有說用 die() 解決。我自己試是都無效。雖然很多人都說可以用。

後來找到了更簡單的作法,不用像 bind() 一樣每次都要 bind() 可以一開始寫完之後動態產生的都套用,類似 live() 但是又不會像 live() 是由 Document 階層開始讀取。


on() 和 delegate() 其實這兩個函式我自己還沒找到差別在哪?不過如果你是用 1.7.1 之後的版本建議你可以用 on()
這個函式了。

先來講一下差異
delegate() 支援 1.4以上的版本,on() 到了 1.7.1 之後裁開始支援

delegate 的用法
$(document).delegate(selector, events, data, handler);

on 的用法
$(document).on(events, selector, data, handler);

發現兩個哪邊不同了嗎?參數互換而已。所以我挑一個做解釋就好了。既然 on 是後期版本的我們就介紹 on 吧!

$("父節點").on("事件","子節點",[如果有的話~回傳值],"動作");

因為他可以指定父節點,所以他就不用像是 live() 一樣由 document 開始巡邏,這樣省掉很多資源。
接下來事件的部份可以指定多個,只要用空白鍵分開例如: click hover 這樣,話不多說,直接看範例。



發現了嗎?用 on 下去寫只需要一開始的時候告訴頁面 class=item 的通通都要讓他點下去以後 alert('hi') 這樣不管後面動態怎…

用 jQuery 外掛達成 ajax 的非同步檔案上傳

圖片
一直以來我都很習慣將表單直接送出後上傳檔案,不過坦白的說這個並不是最順暢的方法。畢竟對使用者來說非同步的作法才是最省事的

找了很久找到了一個很乾淨的外掛,這是依附在 jQuery 底下的,所以在掛這個外掛之前 jQuery 記得也要先掛進來。

外掛官方網站
http://www.phpletter.com/Our-Projects/AjaxFileUpload/

下載後會有很多個檔案,不過最重要的其實只有 ajaxfileupload.js 這個檔案。
其他的是一些版面相關的東西。

我們首先要先在頁面檔案上掛載 jquery.js 然後再掛宰 ajaxfileupload.js
而上傳的界面其實很簡單:

<form name="form" action="" method="POST" enctype="multipart/form-data">
    <input name="fileToUpload" type="file" id="fileToUpload">
    <input id="uploadfile" type="button" value="upload" onclick="ajaxFileUpload();return false;">
</form> 看到上面紅字的地方了嗎?我們就是去呼叫 ajaxFileUpload() 這個函式去執行的。
所以我們要來編寫一下這個函式。



function ajaxFileUpload()
{
    /*
     prepareing ajax file upload
     url: the url of script file handling the uploaded files
     fileElementId: the file type of input element id and it will be the index of  $_FILES Array()
     dataType: it support j…

jQuery UI 搭配 php 完成自動輸入 input 搜尋功能 "autocomplete"

圖片
先準備一下,這個功能是在 jQuery UI 裡面的 autocomplete 功能
http://jqueryui.com/autocomplete/
先掛上這個外掛:
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />   <script src="http://code.jquery.com/jquery-1.9.1.js"></script>   <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
接下來就執行這個 Js 摟
$(function() {
    var availableTags = [];
    $.getJSON('/admin/api_member/get_member_name/?sales_id=S1381118633', function(json) {
        $("#member_name").autocomplete({
            source: json
        });
    });
});
這邊就會去呼叫 /admin/api_member/get_member_name/?sales_id=S1381118633 這個網址。而這個網址吐出來的資料就是一個簡單的 json 陣列就可以啦!

在 liunx 中也可以用 dropbox 與硬碟同步

圖片
Dropbox 是什麼東西我想就不用多說了
在 Windows 上面我們可以很開心的直接讓他和硬碟同步
那麼在 Linux 上面呢?其實官方也是有推出 Linux 的版本,只是沒有那麼顯眼罷了!

請先到這個地方來
下載 DropBox

上面有很多個 Linux 版本的安裝檔可以下載,不過我不建議用這個,其實頁面往下拉有更好的
我個人到最後是採用 CLI 指令碼下載一個 dropbox.py 的檔案。 下載完成後,首先先輸入: python dropbox.py
這時,他就會列出來可以用的功能,當然也可以在這裡找到安裝指令啦!
Dropbox command-line interface commands: Note: use dropbox help to view usage for a specific command. status get current status of the dropboxd help provide help puburl get public url of a file in your dropbox stop stop dropboxd running return whether dropbox is running start start dropboxd filestatus get current sync status of one or more files ls list directory contents with current sync status autostart automatically start dropbox at login exclude ignores/excludes a directory from syncing lansync enables or disables LAN sync
安裝看這裡:

接下來就和 Windows 版本的相同摟