Javascript JQuery单击函数随机停止工作

当用户单击排序图标时，我正在按名字对用户列表进行排序。但是，我注意到，有时我单击排序图标时，图标会被切换，但是数据不会被排序。例如，我点击了10次，可能有3次数据没有排序，但图标改变了。这里的任何帮助都将不胜感激

html代码的一部分。

  <div class="divFullWidth hidden-sx col-sm-2 col-md-2 col-lg-2">
<a href="#" data-action="POST"> First Name</a> 
<a id="sortName" href="#" data-sort="SORT">
<i id="sortIcon" class="sort fa fa-1x fa-sort-alpha-desc"></i></a></div>

  $('#sortName').on('click', function (e) {
         e.preventDefault();
         if ($('#sortIcon').hasClass('fa-sort-alpha-desc')) {
             $('#searchVal').val('asc');
             $('form').submit();
             $(this).find('#sortIcon').removeClass('fa-sort-alpha-desc').addClass('fa-sort-alpha-asc');
         } else {
             $('#searchVal').val('desc');
             var myVal = $('#searchVal').val();
             $('form').submit();
             $(this).find('#sortIcon').removeClass('fa-sort-alpha-asc').addClass('fa-sort-alpha-desc');
         }
     });

---

假设if块和else块中的下一行相同吗

$(this).find('#sortIcon').removeClass('fa-sort-alpha-desc').addClass('fa-sort-alpha-asc');

请尝试以下代码：

$('#sortName').on('click', function (e) {
     e.preventDefault();
     if ($('#sortIcon').hasClass('fa-sort-alpha-desc')) {
         $(this).find('#sortIcon').removeClass('fa-sort-alpha-desc').addClass('fa-sort-alpha-asc');
         $('#searchVal').val('asc');
     } else {
         $(this).find('#sortIcon').removeClass('fa-sort-alpha-asc').addClass('fa-sort-alpha-desc');
         $('#searchVal').val('desc');
     }
     $('form').submit();
 });

---

我更改了代码以查看隐藏字段是否为null。然后，我根据这个决定做了一个决定。新的JQuery代码如下所示，到目前为止运行良好

 $('#sortName').on('click', function (e) {
             e.preventDefault();
             var testVal = $('#searchVal').val();
             if (testVal === 'desc') {
                 $('#sortIcon').removeClass('fa-sort-alpha-desc').addClass('fa-sort-alpha-asc');
                 $('#searchVal').val('asc');
             } else {
                 $('#sortIcon').removeClass('fa-sort-alpha-asc').addClass('fa-sort-alpha-desc');
                 $('#searchVal').val('desc');
             }
             $('form').submit();
         });

像这样试试

$（'a#sortName'）。在（'click'，函数（e）上{
e、 预防默认值（）；
//将当前单击的图标设置为变量。
var findSortIcon=$（this）.find（“#sortIcon”）；
if（findSortIcon.hasClass（'fa-sort-alpha-desc'））{
$（'searchVal'）.val（'asc'）；
//$（'form'）.submit（）；-只要单击按钮，我们就会随时发送提交
findSortIcon.removeClass（'fa-sort-alpha-desc'）.addClass（'fa-sort-alpha-asc'）；
}否则{
$（'searchVal'）.val（'desc'）；
//var myVal=$（'#searchVal'）.val（）；-不需要这个（反正你也不用它）
//$（'form'）.submit（）；-此处相同
findSortIcon.removeClass（'fa-sort-alpha-asc'）.addClass（'fa-sort-alpha-desc'）；
}
//无论是真是假，请提交！
$（'form'）.submit（）；
//额外的东西可以直接检查
var attr=findSortIcon.attr（“类”）；
$（'#show class'）.html（attr+”表示“+$（this）.text（））
});

我知道，在您创建此答案时，您无法创建评论，因此我没有否决投票。但是一旦你可以写评论，你就不应该在答案部分添加这样的问题。谢谢，我意识到了这一点并更新了代码。我正在做$（'sortIcon'）.removeClass（'fa-sort-alpha-desc'）.addClass（'fa-sort-alpha-asc'），但我切换到$（this.find（）。在将代码复制到else语句后，我忘记了替换desc。因为您更改了太多的代码，所以您应该解释您更改了什么以及为什么要解决此问题。您确定每次单击都会重新加载页面吗。我猜有时候请求需要花费很多时间，当你点击排序时你会触发另一个请求。我也考虑过这一点，所以我在做第二次点击之前等待了30秒。我尝试了你的代码，它也能工作。为什么它在创建变量时起作用，而在没有创建变量时不起作用呢？它不是我在

if（）

中为

$（这个）检查的变量。查找（'#sortIcon'）

以便在“that”区域内搜索，而你像

if（$（'#sortIcon'..）

这样的检查只会检查第一个变量。你需要检查“点击”区域。