Проблема Jquery hasclass
У меня возникла проблема с jquery .hasClass
у меня есть таблица с некоторыми данными внутри, и я пытаюсь создать пользовательскую функцию для того, чтобы при нажатии на строку таблицы установить ее с классом "selected", а затем получить идентификатор данных щелкнутого tr, а затем я хочу установить кнопку из disabled= "disabled" в enabled.
Мне удалось получить функцию, чтобы установить нажали строки таблицы с классом 'некоторые' но когда я нажимаю на класс снова я хочу, чтобы удалить класс выделен, а затем установить кнопку для гостей с ограниченными снова и hasClass метод возвращает false в таблице строку выделен, поэтому я не могу установить его, чтобы снять выделение строки и отключить эту кнопку еще раз...
таблица в HTML:
<table class="table table-hover"> <thead> <tr> <th> </th> <th>Title</th> <th>Comments</th> <th>Created</th> <th>Due</th> <th>Creator</th> <th>%</th> <th>Type</th> </tr> </thead> <tbody id="taskstbody"><tr class="table-row taskGrpRow" data-id="chkTask1" id="chkTask1"> <td class="taskGrpRow"></td> <td class="taskGrpRow">Test Task</td> <td class="taskGrpRow">This is a task example</td> <td class="taskGrpRow">1 week ago</td> <td class="taskGrpRow">in 2 Weeks </td> <td class="taskGrpRow">admin</td> <td class="taskGrpRow">0%</td> <td class="taskGrpRow"> To Do</td> </tr><tr class="table-row alert-warning taskGrpRow" data-id="chkTask2" id="chkTask2"> <td class="taskGrpRow"></td> <td class="taskGrpRow">Example Task</td> <td class="taskGrpRow">Example of an overdue task</td> <td class="taskGrpRow">2 months ago</td> <td class="taskGrpRow"> Due 4 Weeks ago</td> <td class="taskGrpRow">admin</td> <td class="taskGrpRow">3%</td> <td class="taskGrpRow"> Follow Up</td> </tr><tr class="bg-success table-row fh-checkbox taskGrpRow selected" data-id="chkTask3" id="chkTask3"> <td></td> <td>Example Task</td> <td>Example of a completed task</td> <td>1 month ago</td> <td>1 Week ago</td> <td>admin</td> <td>100%</td> <td> To Do</td> </tr></tbody> </table>
функция для моей строки таблицы нажмите кнопку:
<script> $(document).ready(function(){ var prevSel =""; var taskid = ""; $("tr.table-row.taskGrpRow").click(function() { var _prevSel = "#" + prevSel; var _curSel = "#" + $(this).data("id"); //only one task selection at a time so check if the previous selection is set and remove selected class if(_prevSel === "#"){ console.log("Previous Selection: Empty"); }else if( _prevSel !== undefined && _prevSel !== _curSel){ }else{ console.log("Previous Selection:" + _prevSel); $(_prevSel).removeClass("selected"); } var taskid = $(this).data("id"); console.log("Task Selected: " + taskid); var itemSelected = "#" + taskid; var classSelected = $(itemSelected).hasClass("selected"); console.log($(itemSelected).className + " | " + classSelected); console.log($(this)); if(classSelected === true){ console.log("Class '.selected Present' on " + $(this).attr("id")); $(itemSelected).removeClass("selected"); $("#selectedTaskDropdown").prop("disabled", true); }else{ console.log("Class '.selected Not Present' on " + $(this).attr("id")); $(this).addClass("selected"); $("#selectedTaskDropdown").prop("disabled", false); } prevSel = taskid; }); }) </script>
classSelected возвращает false, и когда я проверяю консоль разработчика для элемента inspect, строка таблицы имеет класс "selected", поэтому я действительно озадачен тем, почему jquery не возвращает hasClass как true..
любая помощь была бы очень кстати,
заранее спасибо.
Что я уже пробовал:
я пробовал использовать html-селектор '#chkTask3', используя $(this), и ни один из них не работает. каждый раз, когда он возвращает false, я действительно не понимаю, почему он возвращает false, когда DOM ясно показывает, что строка таблицы с идентификатором "chkTask3" имеет класс "selected" в элементе класса.
я даже пытался воспроизвести все это на jsfiddle и там он делает то же самое
выберите строку и включите кнопку - JSFiddle[^]