<script>

$(function(){

$("table tr : nth-child(odd)").CSS("backgroud-color","#eee");//隔行變色

/**全選復選框單擊事件**/

$("#chkAll").click(function(){

if(this.checked){//如果自己被選中

$("table tr td input[type=checkbox]").attr("checked",true);

}else{//如果自己沒被選中

$("table tr td input[type=checkbox]").attr("checked",false);

}

})

/**刪除按鈕單擊事件**/

$(#btnDel).click(function(){

var intL = $("table tr td input:checked : not('#chkAll')").length;//獲取除全選復選框外的所有選中項

if(intL != 0){//如果有選中項

$("table tr td input[type=checkbox] : not('#chkAll')").each(function(index){

if(this.checked){

$("table tr[id=" + this,value +"]").remove();

}

})

}

})

/**小圖片鼠標移動事件**/

var x = 5; var y = 15;//初始化提示圖片位置

$("table tr td img").mousemove(function(e){

$("imgTip").attr("src",this.src)//設置提示圖片src屬性

.css({"top":(e.pageY + y) + "px","left":(e.pageX + x) + "px"})//設置提示圖片的位置

.show(3000);//顯示圖片

})

/**小圖片鼠標移出事件**/

$("table tr td img").mouSEOut(function(){

$("#imgTip").hide();//隱藏圖片

})

})

</script>

<table>

<tr>

<th>選項</th>

<th>編號</th>

<th>封面</th>

<th>購書人</th>

<th>性別</th>

<th>購書價</th>

</tr>

<tr id="0">

<td>

<input id="Checkbox1" type="checkbox" value="0" />

</td>

<td>1001</td>

<td><img src="Images/img01.jpg" alt="" /></td>

<td>黎明</td>

<td>男</td>

<td>35元</td>

</tr>

<tr id="1">

<td>

<input id="Checkbox2" type="checkbox" value="1" />

</td>

<td>1002</td>

<td><img src="Images/img02.jpg" alt="" /></td>

<td>小王</td>

<td>男</td>

<td>40元</td>

</tr>

<tr id="2">

<td>

<input id="Checkbox3" type="checkbox" value="2" />

</td>

<td>1003</td>

<td><img src="Images/img03.jpg" alt="" /></td>

<td>張黎</td>

<td>男</td>

<td>34元</td>

</tr>

</table>

<table>

<tr>

<td style="text-align:left;height:28px">

<span>

<input id="chkAll" type="checkbox" />全選

</span>

<span>

<input id="btnDel" type="button" value="刪除" class="btn" />

</span>

</td>

</tr>

</table>

<img id="imgTip" class="clsImg" src="Images/img03.gif" />