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

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

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

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

步驟二：插入表格和按鈕

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

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

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

步驟四：添加按鈕點擊事件

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

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

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

保存并預(yù)覽

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