다른 요소의 값을 기반으로 요소에 대한 URL 사용 안 함

Question

여러 행이 포함될 테이블이 있습니다. 한 열에는 링크 (열 a)가 있습니다. 두 번째 열에는 문자열 "예"또는 "아니요"(열 b)가 있습니다.

열 b의 셀에 "아니오"라고 표시되어있는 경우 셀의 링크 바로 왼쪽에있는 열을 비활성화해야합니다.

나는 값이 "예"또는 "아니오"인지 확인하기 위해 .each()을 사용하여 b 열의 각 td를 탐색합니다. 마치 열 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') 

코드 조각 :

$(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. 당신은 .regFull의 내용을 손질해야 공간을 제거하기위한 조건으로

2. 다음 .regLink 내부의 링크를 선택 부모 그럴 필요까지 이동 B 열에서 셀, 나는 왼쪽으로 직접 셀에 링크를하려면 "아니오"라고하면

   $(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>