How to determine whether tr in table is selected in jquery-JS Tutorial-php.cn

How to determine whether tr in table is selected in jquery

WBOY

Release： 2021-12-01 12:06:39

Original

2666 people have browsed it

Method: 1. Use the click() method to bind a click event to the tr element and specify an event processing function; 2. Use the "$(selector).index(element)" statement in the event processing function to determine Just specify whether the element is selected and output the position of the selected element.

How to determine whether tr in table is selected in jquery

The operating environment of this tutorial: windows7 system, jquery3.2.1 version, Dell G3 computer.

How does jquery determine whether the tr element in the table is selected

We can use the click() method and index() method to determine whether the tr element is selected Selected.

The click() method indicates that when an element is clicked, a click event will occur. A click occurs when the mouse pointer rests over an element, and then the left mouse button is pressed and released. The click() method triggers the click event, or specifies a function to run when the click event occurs.

index() method returns the index position of the specified element relative to other specified elements.

The example is as follows:

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(function(){
    var myRows = $(&#39;table tr&#39;).click(function(){
        alert(&#39;Row #&#39; +myRows.index(this));
    });
});
</script>
</head>
<body>
<table width="300" border="1" cellspacing="1" cellpadding="2">
  <tr>
    <td width="150">0-1</td>
    <td width="150">0-2</td>
  </tr>
  <tr>
    <td>1-1</td>
    <td>1-2</td>
  </tr>
  <tr>
    <td>2-1</td>
    <td>2-2</td>
  </tr>
  <tr>
    <td>3-1</td>
    <td>3-2</td>
  </tr>
  <tr>
    <td>4-1</td>
    <td>4-2</td>
  </tr>
</table>
</body>
</html>

Copy after login

Output result:

How to determine whether tr in table is selected in jquery

When the first row is selected, the output result:

How to determine whether tr in table is selected in jquery

Recommended related video tutorials: jQuery video tutorial

The above is the detailed content of How to determine whether tr in table is selected in jquery. For more information, please follow other related articles on the PHP Chinese website!