jqGrid表格插件沒(méi)有提供設(shè)置列寬的方法，那只能使用自定義的方法。其中，jquery中的方法css()可以設(shè)置樣式，使用css("width", 數(shù)值)。獲取列表列寬直接使用each()函數(shù)遍歷列表

jqGrid表格插件沒(méi)有提供設(shè)置列寬的方法，那只能使用自定義的方法。其中，jquery中的方法css()可以設(shè)置樣式，使用css("width", 數(shù)值)。獲取列表列寬直接使用each()函數(shù)遍歷列表tr，這樣獲取列表td的寬度。

步驟一：新建靜態(tài)頁(yè)面

首先，雙擊打開HBuilder編輯工具，新建一個(gè)名為的靜態(tài)頁(yè)面。然后在頁(yè)面中引入jquery、jqGrid和bootstrap核心文件。

步驟二：插入表格和按鈕

在lt;bodygt;標(biāo)簽元素中插入兩個(gè)div，分別用來(lái)放置表格和按鈕。這樣可以方便地進(jìn)行操作。在每個(gè)div中插入相應(yīng)的HTML代碼，如下圖所示。

步驟三：編寫列表表頭和表體

在jquery初始化函數(shù)內(nèi)編寫列表表頭和表體的代碼。使用數(shù)組widths的元素作為列表字段的列寬，通過(guò)設(shè)置各個(gè)列的寬度，實(shí)現(xiàn)自定義的列寬效果。

步驟四：添加按鈕點(diǎn)擊事件

分別編寫獲取和調(diào)整兩個(gè)按鈕的點(diǎn)擊事件。在獲取按鈕的點(diǎn)擊事件中，通過(guò)遍歷表格獲取每列的寬度，并將結(jié)果打印到瀏覽器控制臺(tái)上。而在調(diào)整按鈕的點(diǎn)擊事件中，通過(guò)循環(huán)給列表字段寬度賦值，從而實(shí)現(xiàn)調(diào)整列寬的效果。

步驟五：設(shè)置分頁(yè)樣式

最后，設(shè)置列表下方的分頁(yè)樣式，讓分頁(yè)數(shù)值靠近右邊，提供更好的用戶體驗(yàn)。

保存并預(yù)覽

保存代碼并預(yù)覽該靜態(tài)頁(yè)面。分別點(diǎn)擊獲取和調(diào)整按鈕，查看瀏覽器控制臺(tái)打印的結(jié)果，確保功能正常運(yùn)行。