This idea can do reduce the height of the button and make no trouble for row height, but the cissors icon is not in the middle vertically any more. My code is as follow:
{ title: "删除", editable: false, minWidth: 123, sortable: false,
render: function (ui) {return "<button type='button' class='delete_btn'></button>";},
postRender: function (ui) {
var rowIndx = ui.rowIndx,grid = this,$cell = grid.getCell(ui);
$cell.find("button").button({icons: { primary: 'ui-icon-scissors' }})//
.bind("click", function () {
grid.addClass({ rowIndx: ui.rowIndx, cls: 'pq-row-delete' });
setTimeout(function () {
var ans = window.confirm("确定要删除第 " + (rowIndx + 1) + "行吗?");
grid.removeClass({ rowIndx: rowIndx, cls: 'pq-row-delete' });
if (ans) {grid.deleteRow({ rowIndx: rowIndx });}
})
}).css({height:'15px'});
}
}