Question

只是寻找这样做的最佳实践方式。我有一个表格列表信息，在最后一列是一个“编辑/查看”按钮。当用户点击按钮时，会显示div区域，其中包含可以编辑的更多信息

下面的代码包含jstl的一些片段

<script type="text/javascript">
//Click on Edit/View on table
$('.viewCustomer').click(function()
{
    .......
});

</script>

<tr class="odd">
  <td>${customerBean.comName}</td>
  <td>${customerBean.comCode}</td>
  <td class="noRightPad"> <input type="submit" name="createBut" value="View/Edit" class="viewCustomer" /> </td>
</tr>

所以我的问题是：

（1）如何将变量传递给函数$（'。viewCustomer'）。click（function（）

（2）这是实现这一目标的最佳方式。这样做是否更有效/安全/更清洁？

干杯亚历

Answer 1

您不会调用点击功能。单击按钮时会调用它，因此会将事件对象传递给它：

$('.viewCustomer').click(function(evt){
    .......
});

你想要通过什么？您可以使用this和$(this)访问要点击的DOM元素，因此也许可以从此处引用您想要的内容。

编辑评论

如果用户点击了那个按钮在桌子的第4排和里面另一个柱子那一排客户ID 1234我想通过变量1234。

注意：以下所有内容均未经过测试，但应该足够

我们假设您的“客户ID”列的类名为“customerid”。所以你的HTML可能是：

<tr class="odd">
  <td>${customerBean.comName}</td>
  <td class="customerid">${customerBean.comCode}</td>
  <td class="noRightPad"> <input type="submit" name="createBut" value="View/Edit" class="viewCustomer" /> </td>
</tr>

jQuery可能看起来像：

$('.viewCustomer').click(function(){
    var $buttonCell = $(this).parent(); //the <td> containing the button
    var $buttonRow = $buttonCell.parent(); //the <tr> containing the button and your customer id
    var $customerIdCell = $buttonRow.find("td.customerid");
    var customerId = $customerIdCell.text();
});

以上内容分为几行，向您展示如何检索内容。使用“链接”，我们可以更简洁地表达它：

$('.viewCustomer').click(function(){
    var customerId = $(this).parent().parent().find("td.customerid").text();
}

您还可以搜索customerid单元格作为按钮单元格的“兄弟”，以获得更简洁的方法（并减少一个函数调用）。

$('.viewCustomer').click(function(){
    var customerId = $(this).parent().siblings("td.customerid").text();
}

使用jquery将var传递给function（）js

1 个答案: