javascript 在jquery中的双击事件中获取表的rowid

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/15199378/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 23:50:44  来源:igfitidea点击:

Get the rowid of table on double click event in jquery

javascriptjqueryasp.net-mvc-3asp.net-mvc-4

提问by user2017909

I am using mvc4 and jquery.

我正在使用 mvc4 和 jquery。

I am trying to find a way to make an entire row to fire doubleclick event.

我试图找到一种方法来使整行触发双击事件。

My scenario is, the model that contains the parameters Person ID, FirstName and Lastname.

我的场景是,包含参数 Person ID、FirstName 和 Lastname 的模型。

But html table only show the FirstNmae and Lastname.

但是 html 表只显示 FirstNmae 和 Lastname。

Where to store the person id ,if it hidden it will not get in javascript and space problem also.

在哪里存储人员 ID,如果它隐藏它也不会出现在 javascript 和空间问题中。

My need is to, make the rows doubleclickable and that time get the personID and second is to hide the person id from the enduser.

我的需要是,使行双击,然后获取个人 ID,第二个是对最终用户隐藏个人 ID。

For getting personid I used,

为了获得我使用过的personid,

$('#EditTable td').dblclick(function () {
    $(this).find('td:eq(1)')
    $(this).find('td:first').text()
}

but not get any value.

但没有得到任何价值。

回答by musefan

Solution

解决方案

The problem is that the event is firing for the tdelement, so thisrefers to the tdelement. You need to get the parent trand then call the findfunction.

问题是事件正在为td元素触发,因此this引用td元素。您需要获取父项tr,然后调用该find函数。

Something like this:

像这样的东西:

$('#EditTable td').dblclick(function () {
    var $this = $(this);
    var row = $this.closest("tr");
    row.find('td:eq(1)');
    row.find('td:first').text();
}); //<-- NOTE: you dont close correctly in your example, which cause console errors

Here is a working example.

这是一个工作示例。



Alternatively, you could assign the event to the trelement instead, which would allow you to keep your original function code...

或者,您可以将事件分配给tr元素,这将允许您保留原始功能代码...

$('#EditTable tr').dblclick(...


Personally, I would prefer to store "metadata" type things using a dataattribute. For example:

就个人而言,我更喜欢使用data属性来存储“元数据”类型的东西。例如:

$('#EditTable td').dblclick(function () {
    var $this = $(this);
    var row = $this.closest("tr");
    var id = row.data("id");
});

with the following html table:

使用以下 html 表:

<table id="EditTable">
    <tr data-id="1">
        <td>1</td><td>One</td>
    </tr>
</table>

Here is a working example using data attributes.

这是一个使用数据属性的工作示例。

回答by Aravind

Actually you can store the model details in DOM tree using $.data('personID',1)method. In that way you can hide the personIDfrom the user. When the user dbl clicks on a row, get the corresponding personIDlike $.data('personID')

实际上,您可以使用$.data('personID',1)方法将模型详细信息存储在 DOM 树中。通过这种方式,您可以personID对用户隐藏。当用户 dbl 点击一行时,得到对应的personIDlike$.data('personID')

//setting the personID
$.data('personID',2);

//getting the personID
$.data('personID'); //returns 2

回答by iappwebdev

You have to write:

你必须写:

// You want event fired on row `tr` and not on `td`
$('#EditTable tr').dblclick(function () {
    $(this).find('td:eq(1)')
    $(this).find('td:first').text()
}

Edit

编辑

Best way would be:

最好的方法是:

$('#EditTable').on(dblclick, 'tr', function () {
    var $rowClicked = $(this);
    var secondCell = $rowClicked.find('td:eq(1)');
    var textOfFirstCell $rowClicked.find('td:first').text();
}

回答by bipen

try this

试试这个

$('#EditTable tr').dblclick(function () {
  var $this=$(this);
  $this.find('td:first').text(); //get personid
  $this.find('td:first').hide(); //hide the personrow... u can use remove()
});

回答by Jai

try this one:

试试这个:

 $('#EditTable tr').dblclick(function () {
   $(this).find('td:eq(1)')
   $(this).find('td:first').text()
 });

Try to iterate through TRsinstead and may be that's a typo or what you have a error at closing that should be });

尝试迭代TRs,这可能是一个错字或者你在关闭时有错误应该是});