jQuery 基礎教學

Part1: 簡介

jQuery 是一個超級無敵強大的工具，有了他， javascript 變得十分簡單。
相信很多人都會跟我一樣，在剛學習的時候有一個問題：

Q: 要先學會javascript 還是 jQuery ?

A: 簡單一點來說，以C++ 做為舉例

javascript 就等於是 C++

而 jQuery 就等於是 別人幫你寫好的Class

因此你還是要先懂一些C++的語法

有哪些語法呢?

我覺得只要知道怎麼宣告變數、跟用迴圈就夠了

因為，其他javascript 辦得到得事情，jQuery 辦得更快

因此我直接切入正題

----------------------------------------------------------------------------

Part2: 基本的jQuery 架構

$(document).ready(function() {



  // Handler for .ready() called.



});

基本上任何的javascript 都寫在 document .ready 裡面就對了

這個code 的意思就是：在我的網頁(DOM) load 完成之後，我要做些甚麼事情

在jQuery 中，  $   這個符號代表的就是jQuery

因此你也可以寫成jQuery(document).ready

----------------------------------------------------------------------------

Part3: 常用的語法

通常我們最常用的就是按下按鈕時，我們希望叫javascript 幫我們做事情

因此其實jQuery 的概念就是

1.利用選擇器選取要操作的DOM

2.修改他

我舉個例子:

<button id="click" class="me" type="button">Click Me!</button>

<input type="text" class="mouse" name="LastName" value="Mouse">

上面是兩個基本的DOM

buttom 擁有id 與 class

而input 擁有 class 與 name

所以我們首先第一步要先選擇DOM

在選擇器方面通常我們會選的依據有兩種

id 或者是 class

所以name在這邊沒屁用

假設我要選擇buttom這個東西的時候，我可以這樣寫

第一步驟：選擇DOM

$("#click")  或者是 $(".me")

記住一定要有單引號或雙引號，不然你可能會很納悶程式怎麼都跑不出來

我就在這邊吃了很多悶虧

第二步驟:做事情

通常我們會把事情寫在function 裡面，假設是click事件

$(".me").click(function() {
    //要做的事情
    $(".mouse").attr("value", "hello");
});

如此一來我在點擊button 時就會將input 的值從mouse 改成 hello

很簡單吧! 設定 input 的屬性竟然只需要一行就完成!!


大致上這就是jQuery 基礎會用到的東西

MYSQL基本語法

MYSQL基本語法


insert into 資料表名稱(欄位1,欄位2)

values('值1','值2');

http://james670818.pixnet.net/blog/post/4411857-%5Bphp%5D-pdo-ii
net start mysql啟動 MySQL

查詢資料庫、資料表、欄位等資訊
mysqlshow [-h ipAddress] -u user_name -pmysqlshow -u user_name@ipAddress -p
列出所有資料庫

mysqlshow -u user_name -p db_name列出該 database_name 所有資料表

mysqlshow -u user_name -p db_name table_name列出該 database_name 裡 table_name 資料表裡的欄位

mysqlshow -u user_name -p db_name table_name field_name
列出該 database_name 裡 table_name 的 field_name 的欄位資訊

更改密碼mysqladmin password 'new_password'更改目前系統登入使用者的密碼

於資料庫中導入執行sql script 檔
mysql db_name < sql_filename.sql
與 MySQL 連線
mysql [-h ipAddress] -u user_name -ppasswordmysql [-h ipAddress] -u user_name -p

切換使用資料庫 database_name
mysql> USE db_name
mysql> SELECT DATABASE();列出目前預設的資料庫名稱

mysql> SHOW DATABASES;
列出所有資料庫

mysql> SHOW DATABASES LIKE 'my%';
列出所有資料庫名稱為 my 開頭的

mysql> SHOW TABLES FROM db_name [LIKE ...];
列出該資料庫所有資料表名稱

mysql> SHOW COLUMNS FROM table_name [LIKE ...];
mysql> SHOW COLUMNS FROM table_name FROM db_name  [LIKE ...];mysql> SHOW FIELDS FROM table_name [LIKE ...];
mysql> DESCRIBE table_name ;
mysql> EXPLAIN table_name ;
列出該資料表所有欄位名稱

mysql> SHOW INDEX FROM table_name [LIKE ...];
mysql> SHOW INDEX FROM table_name FROM db_name  [LIKE ...];mysql> SHOW KEY FROM table_name [LIKE ...];
列出該資料表所有索引資訊

mysql> SHOW TABLE STATUS;mysql> SHOW TABLE STATUS FROM db_name  [LIKE ...];列出資料表的相關資訊

mysql> SHOW VARIABLES [LIKE ...];
顯示 MySQL 相關參數設定

mysql> SHOW VARIABLES LIKE '%character%' ;顯示資料庫語系設定資訊

mysql> SHOW PROCESSLIST;
列出與 MySQL 連線的 threads 狀態

mysql> SHOW STATUS;
列出與 MySQL 目前的狀態
當進行資料表檢查或修補時，鎖定資料表可確保資料表的安全
(READ：唯讀狀態、WRITE：無法寫入也無法讀取)
mysql> LOCK TABLE table_name READ;mysql> FLUSH TABLES;
鎖定資料表 

mysql> UNLOCK TABLE;
資料表解除鎖定 

無痛使用jQuery Ajax

今天要讓大家無痛使用 jQuery Ajax

讓大家可以跳過看複雜的document直接來這邊取用就可以了

Part1: 程式範例

先舉例一個做ajax的情況

例如: 點擊一個按鈕，做一些什麼事情

因此可以這樣寫:

$('.btn').click(function() {
    $.ajax({
        url: "check_password.php",
        data: {
            old_password: $("#old_password").val()
        },
        type: "POST",
        dataType: "json",
        success: function(data,textStatus,jqXHR) {
          .....code here
        },
        error: function() {
            ...code here
        },
        complete: function() {
            ...code here
        }
        
    });
});

只要在事件中寫入 $.ajax( ..... );

就算是做一次ajax 了

Part2: Ajax 設定與使用

然而 jQuery 的 Ajax 有許多方法可以呼叫

其中就以$.ajax() 有最多的東西可以設定，所以我們只介紹這個


在url設定要將資料傳到哪個檔案

在data設定要傳送的變數

在type設定傳送的方式 (GET/POST)

在dataType設定回傳的格式(html/script/json/xml)

在success, error, complete 設定ajax 回傳後要做的事件


Part3: 程式說明

這邊我們以json當作舉例

程式碼中我們將變數以POST的方式傳送到check_password.php

然後以json的方式傳回變數data

因此data就是我們做完ajax 所得到的資料



在這邊筆者一開始有一小點困惑

究竟在check_password.php中回傳資料要使用echo 還是 return?

A:答案是echo

因為data這個變數在一開始就像是一張空白的紙，你所有在check_password.php 做的輸出都會直接output 到 data

而Ajax 會將data 以 html的方式抓回來



到這邊有人會有疑問的是: 我不是選擇以json的方式抓回來嗎?

在這邊我要解釋的是，其實ajax 抓資料分為兩步驟

首先先以html的方式抓回, 再轉換為使用者要求的格式

如此就可以無痛的使用Ajax囉!

無痛安裝Solr

無痛安裝Solr

wget http://download.nextag.com/apache/lucene/solr/4.2.0/solr-4.2.0.tgz #下載
tar -zxvf solr-4.2.0.tgz #解壓縮執行

cd exampledocs
java -jar start.jar #執行主程式
INFO::Started SocketConnector@0.0.0.0:8983 #代表啟動

cd exampledocs
./post.sh monitor.xml #匯入index

http://localhost:8983/solr/select?q=*:*&wt=json #搜尋

http://localhost:8983/solr/ #瀏覽solr主頁


實作 Multi-Core
mkdir collection2/conf collection2/data


修改 solr.xml
<cores adminPath="/admin/cores">
  <core name="collection1" instanceDir="collection1" />
  <core name="collection2" instanceDir="collection2" />
</cores>

cp post.sh post2.sh
修改post.sh
URL = http://localhost:8983/solr/collection2/update

DIH ?
Memcached Solr ?

語法：

q - 查詢字串，必須的。

fq - 在q查詢符合結果中同時是fq查詢符合的。

fl - 指定返回那些欄位內容，用逗號或空格分隔多個。

start - 返回第一條記錄在完整找到結果中的偏移位置，0開始，一般分頁用。

rows - 指定返回結果最多有多少條記錄，配合start來實現分頁。

sort - 排序，格式：sort=<field name>+<desc|asc>[,<field name>+<desc|asc>]… 。示例：（inStock desc, price asc）表示先 “inStock” 降冪, 再 “price” 昇冪，默認是相關性降冪。

wt - (writer type)指定輸出格式，可以有 xml, json, php, phps, 

q.op - 覆蓋schema.xml的defaultOperator

df - 默認的查詢欄位，一般默認指定

qt - （query type）指定那個類型來處理查詢請求，一般不用指定，默認是standard。

indent - true|on，json,php,phps,ruby輸出才有必要用這個參數。

參考：
http://www.solrtutorial.com/solr-in-5-minutes.html
http://blog.chenlb.com/category/solr-search
http://www.joetsuihk.com/apache_solr_%E5%A4%9A%E7%AB%99%E8%A8%AD%E5%AE%9A_multi_core_setup?language=zh-hant

Install a Web Server in CentOS on VirtualBox

下載 CentOS
http://isoredirect.centos.org/centos/6/isos/i386/

開一台虛擬機器
記憶體 512MB 硬碟 8G (沒出現圖形介面安裝 因為記憶體太小需652以上)
系統 > 處理器 > 啟用 PAE/NX
喜好設定 > 一般 > 可選擇機器資料夾
網路設定使用橋接器，跟實體機器橋接

安裝請選擇 Install or upgrade an existing system
完成

安裝 GNOME or KDE

yum  groupinstall "X Window System" "GNOME Desktop Environment"

yum groupinstall "X Window System" "KDE (K Desktop Environment)"

關閉 selinux
vim /etc/sysconfig/selinux
SELINUX=disabled

關閉 iptables
vim /etc/sysconfig/iptables
iptables -F # 清除 iptables 設定

設定網路卡
vim /etc/sysconfig/network-scripts/ifcfg-eth0
ONBOOT=yes #開機自動使用 eth0 這張網卡

安裝 apache mysql php
yum install httpd
yum mysql mysql-server php-mysql
yum php

修改 DocumentRoot
vim /etc/httpd/conf/http.conf

設定開機啟動 apache mysql
chkconfig httpd on
chkconfig mysql on

同步資料夾需安裝 Guest Addition
出現錯誤訊息 Building the main Guest Additions module[FAILED]
安裝 yum install gcc make dkms kernel-devel kernel-headers
裝置 > 插入 Guest Addition CD 映像
點選 autorun.sh 安裝

裝置 > 共用資料夾設定 > 機器資料夾 > vbox D:\Dropbox\www
mount -t vbox /home/www
mount -l #查看 mount 的機器
umount vbox #卸除 mount 機器

設定開機啟動 my.script
vim /etc/rc.d/rc.local

host 設定
C:\Windows\System32\drivers\etc
192.168.0.x mysite.com

mysql 設定
mysqladmin -u root password 'your.password'
mysql -u root -p

mysql 匯出匯入
create db_name
mysqldump -u root -p db_name > backup.sql #匯出
mysql -u root -p db_name < backup.sql #匯入

(mac注意事項)
修改 VirtualBox 共同資料夾位置 (/users/abc/dropbox/www)
重啟 mount httpd

NameVirtualHost *:80 
<VirtualHost *:80> 
DocumentRoot /www/example1 
ServerName www.example1.com 
</VirtualHost> 

<VirtualHost *:80> 
DocumentRoot /www/example2 
ServerName www.example2.org 
# Other directives here 
</VirtualHost> 

將Click-Me imgur的圖片下載

將Click-Me imgur的圖片下載

#!/bin/bash
cat 'temp.txt' | while read line
do
    temp=$(echo $line | sed 's/^M//')
    index=$(echo $temp | awk -F "," '{ print $1 }')
    content=$(echo $temp | awk -F "," '{ print $2 }')
    picture=$(echo $temp | awk -F "," '{ print $3 }')
    flag=$(echo $temp | awk -F "," '{ print $4 }')

#如果等於1 就建一個資料夾
if [ ! -d /var/www/html/imgbackup/image/$index ]; then
    mkdir ./image/$index
fi

wget -t0 -O ./image/$index/$picture.jpg $content
echo "現在進行到-$index"
done

Linux Shell Script

#!/bin/bash
cat 'temp.txt' | while read line
do
temp=$(echo $line | sed 's/^M//') #將讀取進來的資料去除^M
index=$(echo $temp | awk -F "," '{ print $1 }') #用逗點分隔開，第一個字串。

if [ ! -d /var/www/html/imgbackup/image/$index ]; then #如果$index資料夾不存在
    mkdir ./image/$index
fi

wget -t0 -O ./image/$index/$picture.jpg $content #下載資料