JQuery Parent ('tr') onFocus

The application I am creating uses a large table with data entry fields for writing data. I need to give the user a visual hint about which row of the table they are in to help them navigate the form.

I currently have

onFocus="HighlightTableRow()"

in the drop down list. When the user clicks or tabs into this form element, the row of the parent table should be highlighted. So here is the function called onFocus:

function HighlightTableRow(){  
  $(this).parent("tr").addClass('RowHighlight');  
  //alert($(this));  
}

Two problems:

  • When this line is not used (form element NOT onFocus), then I need .removeClass ('RowHighlight'). Not sure how to do this.
  • I can't seem to select the selector correctly. The warning I commented will fire, but nothing happens with the tr element style.

. !

+3
2
<select name="ContactMade[]" id="ContactMade">

JavaScript:

$("#ContactMade").focus(function() {
    $(this).closest("tr").addClass('RowHighlight');
})
.blur(function() {
    $(this).closest("tr").removeClass('RowHighlight');
});
+14

, ... , backgorund: css "RowHighlight" :

RowHighlight td
{
   background-color:red;
}

, .

jQuery ToggleClass(), jQuery

+1

Source: https://habr.com/ru/post/1767942/


All Articles