我想檢查一個元素是否有其他元素內的特定類名

Question

我在我的應用程序中有多個錶行並想要刪除其中的一個。 我有一個功能，當我點擊一個按鈕時，另一個錶行。

首先我：

<table> 
    <thead> ... </thead> 
    <tbody> 
    <tr id='firstObject'> <td> <i class="icon-chevron-right clickable expand-alert"></i> </td> <td> @Ajax.RawActionLink("<i class='icon-trash'></i>", "_DeleteAlert", "Group", new { alertId = alert.Id }, new AjaxOptions 
    { 
     HttpMethod = "POST", 
     OnSuccess = "onDeleteAlertSuccess(" + alert.Id + ")" 
    }, new { @title = "Verwijder alarm" }) </td> </tr> 
    <tr id='secondObject'> <td> <i class="icon-chevron-right clickable expand-alert"></i> </td> <td> @Ajax.RawActionLink("<i class='icon-trash'></i>", "_DeleteAlert", "Group", new { alertId = alert.Id }, new AjaxOptions 
    { 
     HttpMethod = "POST", 
     OnSuccess = "onDeleteAlertSuccess(" + alert.Id + ")" 
    }, new { @title = "Verwijder alarm" }) </td> </tr> .... 

但是，如果我在i點擊類icon-chevron-right變得icon-chevron-down和獲取：

<tbody> 
<tr id='firstObject'> <td> <i class="icon-chevron-down clickable expand-alert"></i> </td> <td> @Ajax.RawActionLink("<i class='icon-trash'></i>", "_DeleteAlert", "Group", new { alertId = alert.Id }, new AjaxOptions 
    { 
     HttpMethod = "POST", 
     OnSuccess = "onDeleteAlertSuccess(" + alert.Id + ")" 
    }, new { @title = "Verwijder alarm" }) </td> </tr> 
<tr id='info'> ... </tr> 
<tr id='secondObject'> <td> <i class="icon-chevron-right clickable expand-alert"></i> </td> <td> @Ajax.RawActionLink("<i class='icon-trash'></i>", "_DeleteAlert", "Group", new { alertId = alert.Id }, new AjaxOptions 
    { 
     HttpMethod = "POST", 
     OnSuccess = "onDeleteAlertSuccess(" + alert.Id + ")" 
    }, new { @title = "Verwijder alarm" }) </td> </tr> .... 

沒有談到的伎倆。如果我點擊刪除按鈕，我想刪除該行，並且如果$(i).hasClass('icon-chevron-down')也刪除與id='info'的行的下一行。我的代碼tr的沒有id，這只是爲了更好地解釋它。

這裏是我的功能：

function onDeleteAlertSuccess(id) { 
     $('#alert-detail-table').find('tr').each(function() { 
      if ($(this).attr('data-id') == id) { 
       $(this).fadeOut(400, function() { 
        if ($(this).next($('td').next($('i').hasClass('icon-chevron-down')))) { 
         $(this).next('tr').remove(); 
        } 
        $(this).remove(); 
       }); 
      } 
     }); 
    } 

第二，如果始終是真實的，但它必須是如果!$('i').hasClass('icon-chevron-down')假的。現在，如果id='icon-chevron-right'刪除了下一個表格行id='secondObject'，那就不對了。

我該如何解決這個問題？

編輯：

我解決了這個問題，幫助傑里米：

function onDeleteAlertSuccess(id) { 
     $('#alert-detail-table').find('tr').each(function() { 
      if ($(this).attr('data-id') == id) { 
       $(this).fadeOut(400, function() { 
        var tr = $(this); 
        var nextElement = tr.next(); 

        tr.find("i").each(function() { 
         if ($(this).hasClass("icon-chevron-down")) { 
          nextElement.remove(); 
         } 
        }); 
        //if ($(this).first($('td:first-child').hasClass('icon-chevron-down'))) { 
        // debugger; 
        //} 
        //if ($(this).next($('td').next($('i').hasClass('icon-chevron-down')))) { 
        // $(this).next('tr').remove(); 
        //} 
        $(this).remove(); 
       }); 
      } 
     }); 
    } 

Answer 1

你的代碼沒有聯繫，作爲一個評論說，西瓦，但我還是要tryed用它做什麼。如果我理解得很好，單擊刪除按鈕應該刪除鏈接的行，以及如果在其中定義了一些類後的行。

所以我做了一點點搗鼓，展示如何做到這一點很容易與jQuery：jsfiddle

$(function() { 
    $(document).on("click", ".deleteLink", function() { 
     var tr = $(this).parent().parent(); 
     var nextElement = tr.next(); 

     if(nextElement.hasClass("notLink")) { 
      nextElement.remove();  
     } 

     tr.remove(); 

     return false; 
    }); 
}); 

notLink是類TR的應刪除由它的上排，並deleteLink是類您的刪除按鈕

編輯：

如果類是i元素上，而不是在tr，那麼它也是簡單的檢查;請參閱the updated fiddle和代碼對應：

$(function() { 
    $(document).on("click", ".deleteLink", function() { 
     var tr = $(this).parent().parent(); 
     var nextElement = tr.next(); 

     nextElement.find("i").each(function() { 
      if($(this).hasClass("toRemove")) { 
       nextElement.remove(); 
      } 
     }); 

     tr.remove(); 

     return false; 
    }); 
});