将当前行值获取到jQuery事件处理程序中而不进行循环
我知道如何使用自定义格式化程序并在jqGrid调用JavaScript函数。 我也知道我可以使用gridComplete函数绑定一个jQuery事件。 我的问题类似于以下内容 – 但不一样。 jqGrid中的自定义格式化程序，它调用jQuery函数
好的，在上面问题中提到的方法中，我们可以对格式化程序返回的元素的click事件使用jQuery函数 – 但它需要循环遍历所有行。
在jqGrid有没有更好的方法将当前行值放入jQuery event handler而不进行循环 ？
注意：请注意，我需要调用一个jQuery event handler ，它将处理当前行值 – 而不是一个简单的javascript函数。
我的代码如下所示。
function clickme(rowID) { alert("hi"); } $(document).ready(function() { $("#grid").jqGrid({ url: "GamesList.aspx/GetMyGames", mtype: 'POST', postData: { gameSearch: $('#txtGameName').val(), ownerSearch: $('#txtOwner').val(), createdDateFrom: $('#txtCreatedFrom').val(), createdDateTo: $('#txtCreatedTo').val(), liquidAmountFrom: $('#txtLmiquidAmountFrom').val(), liquidAmountTo: $('#txtLmiquidAmountTo').val() }, datatype: "local", //json if want to load initially ajaxGridOptions: { contentType: 'application/json; charset=utf-8' }, serializeGridData: function(postData) { return JSON.stringify(postData); }, jsonReader: { repeatitems: false, root: function(obj) { return obj.d; } }, colNames: ['GameID', 'GameName', 'GameOwner', 'PlannedCloseDate', 'CreatedOnDate', 'GameLiquidAmount', 'Join'], colModel: [{ name: 'GameID', index: 'GameID' }, { name: 'GameName', index: 'GameName' }, { name: 'GameOwner', index: 'GameOwner' }, { name: 'PlannedCloseDate', index: 'PlannedCloseDate', formatter: 'date', formatoptions: { srcformat: 'm/d/Y', newformat: 'm/d/Y' } }, { name: 'CreatedOnDate', index: 'CreatedOnDate', formatter: 'date', formatoptions: { srcformat: 'm/d/Y', newformat: 'm/d/Y' } }, { name: 'GameLiquidAmount', index: 'GameLiquidAmount' }, { name: 'Join', index: 'GameID', width: 30, formatter: function(cellvalue, options, rowObject) { return ''; } }], rowNum: 10, /*rowList: [10, 20, 30],*/ pager: '#pager2', sortname: 'id', viewrecords: true, sortorder: "desc", caption: "Games", gridview: true, height: "auto", loadonce: true, recordtext: "Records {0} - {1} of {2}", emptyrecords: "No records to view", loadtext: "Loading...", pgtext: "Page {0} of {1}", gridComplete: function() { //Assign a click event to custom button [after gridComplete] $(".app-custom-button-join").click(function() { alert("HELLO"); }); } }); $("#btnSearch").click(function(e) { $("#grid").jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid'); e.preventDefault(); }); });
参考文献：
- jqgrid自定义格式化程序按钮单击事件不起作用
- jqGrid gridComplete： – getRowData – 从数组中获取行单元格值
- jqGrid和jquery点击事件的问题
- jqGrid中的自定义格式化程序，它调用jQuery函数
你是对的。 您当前的代码为列Join每个span.app-custom-button-join绑定单独的 （ 多个 ） click处理程序。 为了使代码更有效，可以在整个网格上注册一个 click处理程序。 标准事件处理使冒泡（从内到外）。 jqGrid已经注册了一个click处理程序，它具有onCellSelect和onCellSelect ，它将在click处理程序内部调用。 因此，您可以使用更有效的gridComplete回调代码替换gridComplete 。 相应的实现如下所示
beforeSelectRow: function (rowid, e) { var $self = $(this), $td = $(e.target).closest("tr.jqgrow>td"), rowid = $td.parent().attr("id"), rowData = $self.jqGrid("getLocalRow", rowid), // or rowData = $self.jqGrid("getRowData", rowid) iCol = $td.length > 0 ? $td[0].cellIndex : -1, colModel = $self.jqGrid("getGridParam", "colModel"); if (iCol >= 0 && colModel[iCol].name === "Join" && $(e.target).hasClass("app-custom-button-join")) { alert("HELLO"); return false; } return true; }
上面的代码显示了如何获取单击行的rowid 。 从beforeSelectRow返回的布尔值允许您通过单击图标拒绝选择行（如果它是必需的）。 只需从beforeSelectRow返回false以防止选择。
好吧，我不太确定解决方案的效率，但你可以让行中的数据有一个事件处理程序，如：
$(document).on("click", "#id", function(){});
然后你可以使用$(this).val(); 找到元素的值。
这是否回答你的问题？？？