別の要素の値に基づいて要素のURLを無効にする

Question

私はいくつかの行を持つテーブルを持っています。ある列には、リンク（列a）があります。 2番目の列には、文字列「はい」または「いいえ」（列b）があります。

列Bのセルが「No」と言えば、私は直接、列Aのそれの左にあるセルのリンクが無効になりたいです。

私は値が「はい」か「いいえ」であるかどうかを確認するために列Bの各TDを通過する.each()を使用しています。あたかも列bのセルが「はい」であっても、一致するセルのリンクを無効にする（名前を変更する）ように見えます。私は何が欠けていますか？代わりに、この行の

$(document).ready(function() { 
 

 
    $("td.regFull").each(function() { 
 

 
    console.log($(this).text()); 
 
    if($(this).text() !== 'No') { 
 
     $('td.regLink a').replaceWith('Closed'); 
 
    } 
 
    
 
    }); 
 

 
});

td { 
 
    border: 1px solid black; 
 
    padding: 5px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <th>Link</th> 
 
    <th>Registration Open</th> 
 
    </tr> 
 
    <tr> 
 
    <td class="regLink"> 
 
     <a href="#">Register</a> 
 
    </td> 
 
    <td class="regFull"> 
 
     No 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td class="regLink"> 
 
     <a href="#">Register</a> 
 
    </td> 
 
    <td class="regFull"> 
 
     Yes 
 
    </td> 
 
    </tr> 
 
</table>

Answer 1

私の提案は次のとおりです。

あなたはhref属性を削除することができるリンクを無効にするために。

$("td.regFull:contains('No')").siblings('td.regLink').children('a').removeAttr('href') 

スニペット：

あなたが .regFullのコンテンツをトリミングする必要が

$(function() { 
 
    
 
$("td.regFull:contains('No')").siblings('td.regLink').children('a').removeAttr('href').text('Closed'); 
 

 
});

td { 
 
    border: 1px solid black; 
 
    padding: 5px; 
 
}

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 

 
<table> 
 
    <tr> 
 
     <th>Link</th> 
 
     <th>Registration Open</th> 
 
    </tr> 
 
    <tr> 
 
     <td class="regLink"> 
 
      <a href="#">Register</a> 
 
     </td> 
 
     <td class="regFull"> 
 
      No 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td class="regLink"> 
 
      <a href="#">Register</a> 
 
     </td> 
 
     <td class="regFull"> 
 
      Yes 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td class="regLink"> 
 
      <a href="#">Register</a> 
 
     </td> 
 
     <td class="regFull"> 
 
      No 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td class="regLink"> 
 
      <a href="#">Register</a> 
 
     </td> 
 
     <td class="regFull"> 
 
      Yes 
 
     </td> 
 
    </tr> 
 
</table>

Answer 2

$（ 'td.regLinkのA'）replaceWith（ 'クローズ'）。

最も近い要素として

$（この）.closest（ 'td.regLink a' を）それを作るreplaceWith（ 'クローズ'）。

Answer 3

1. あなたは1行にすべてを減らすことができるすべてのリンクを選択するには

   スペースを取り除くための条件で。

2. ゴー親trまで、その後.regLink内部リンクを選択：列Bのセルが「No」と言う場合

   $(this).parents('tr').find('.regLink a').replaceWith('Closed'); 
   

3. を、私は直接左のセルにリンクをしたいですその列aに無効になる

   したがって、条件のオペレータを!==から===に戻す必要があります。

希望します。

$(document).ready(function() { 
 

 
    $("td.regFull").each(function() { 
 

 
    console.log($(this).text().trim()); 
 

 
    if($(this).text().trim() === 'No') { 
 
     $(this).parents('tr').find('.regLink a').replaceWith('Closed'); 
 
    } 
 

 
    }); 
 

 
});

td { 
 
    border: 1px solid black; 
 
    padding: 5px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <th>Link</th> 
 
    <th>Registration Open</th> 
 
    </tr> 
 
    <tr> 
 
    <td class="regLink"> 
 
     <a href="#">Register</a> 
 
    </td> 
 
    <td class="regFull"> 
 
     No 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td class="regLink"> 
 
     <a href="#">Register</a> 
 
    </td> 
 
    <td class="regFull"> 
 
     Yes 
 
    </td> 
 
    </tr> 
 
</table>