jquery完成帶單選按鈕的表格行高亮顯示

jquery完成帶單選按鈕的表格行高亮顯示

       上篇博客寫的是複選框的，這次寫的是單選框的，有時查詢的時候，只能選擇一條記錄，如果將選中的這條記錄的行高亮顯示，同時該行的單選按鈕也被選中了，這樣會提高用戶的體驗的。如今的時代，就是用戶體驗的時代。

效果如下：

CSS文件如下如下所示：

.selected{ 
       background:#FF6500;
       color:#fff;
}：

這次的js文件的代碼就變得更簡單了，如下所示：

/**
 * 設置含有單選按鈕的表格的背景顏色
 */
$(document).ready(function()
{
	/**
	 * 表格單擊的時候改變背景色
	 */
	$("#tablight tr:gt(0)").click(function() //獲取第2行及以後的
	{
		$(this).addClass("selected").siblings().removeClass("selected").end().find(":radio").attr("checked",true);
	});
});

如果想要使代碼生效，需要給表格加上id屬性，屬性值爲“tablight”。這個一旦做好了，只要在用的時候引用這兩個文件就行了。