2013-11-22 2 views
0

jquery this.next 함수를 사용하여 작은 문제로 고민하고 있습니다. 순간 작동하지 않습니다 여기jquery this.next validation

<div style="float: left; width: 50px;"><input class="network" type="checkbox" name="netW[]" value="PC1" id="PC1" /></div> 
    <div style="float: left; width: 350px;"><span>PC1</span><br /><span class="networkRole"> 
     <div style="margin-left: 10px; color: red;"> 
      <input class="NRoles" type="checkbox" name="networkRoles[PC1][]" value="CE" />CE</div> 
       <div style="margin-left: 20px; color: #000;"><div style="width: 50px; margin-left: 20px;" class="readwrite"><input type="checkbox" name="rw[PC1][CE][]" value="Read" class="checkRW" /><span style=\"margin-left: 10px;\">Read</span></div> 
       <div style="width: 50px; margin-left: 20px;" class="readwrite"><input type="checkbox" name="rw[PC1][CE][]" value="Write" class="checkRW" /><span style=\"margin-left: 10px;\">Write</span></div> 
       </div> 

및 JQuery와 :

가 빈 필드와 같은 메시지를 제공하도록

내가 유효성을 검사 할 등 여기

는 HTML의
(".checkRW").click(function(){ 
alert ($(this).parent().next().children('.checkRW')); 
}); 

나는 그 다음으로 길을 잃었습니다(). 어디서 잘못 될까요? 브롬, 토비

+0

'여기'가 무엇을 의미합니까? 내 말은, 각각의 관련 코드 블록을 추가하면,'this'는 HTML의 div 나 input이나 무엇이든 될 수 있습니다. 우리는 단순히 추측 할 수 없습니다. –

+0

안녕하세요, this is this class = "network" – user2023042

+0

'this'는'checkRW'의 클래스를 갖고 클릭 된 태그 인 input 매크로를 나타냅니다. Javascript는 코드의 {'} '블록에 대해 매우 구체적이고'this'는 항상 블록을 참조합니다. –

답변

1

문제는 next()이 (가) 검색에서 만 발생한다는 것입니다. prev()을 사용하여 뒤로 또는 위로 볼 수 있습니다. 또는 귀하의 경우 siblings() 양방향으로 보일 것입니다.

문 끝에 .val()을 추가하여 alert에 사람이 읽을 수있는 텍스트가 표시되도록 할 수도 있습니다.

그래서 당신은 시도 할 수 있습니다 :

$(this).parent().siblings().children('.checkRW').val() 

물건을 테스트하는 개발자보기로 이동하는 것이 도움이된다. Firefox를 사용하고 있다면 페이지를 마우스 오른쪽 버튼으로 클릭하고 Inspect Element with Firebug을 선택하여 Firebug를 볼 수 있습니다. 그런 다음 Console 탭으로 이동하십시오. 콘솔 맨 아래에 jQuery select 문을 입력하고 Enter 키를 누릅니다. 그러면 콘솔에 선택 항목이 표시됩니다. 귀하의 경우에 this은 jQuery()를 가리키기 때문에 콘솔에서는 작동하지 않으므로 속성을 input 필드에 추가하고이를 기반으로 검색해야합니다. 다음과 같이 입력하십시오 :

$('#1').parent().siblings().children('.checkRW').val() 

여기에 제가 테스트 해본 결과 제안한 버전이 있습니다.

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1"> 
<title>Insert title here</title> 
</head> 
<body> 
    <div style="float: left; width: 50px;"> 
     <input class="network" type="checkbox" name="netW[]" value="PC1" id="PC1" /> 
    </div> 
    <div style="float: left; width: 350px;"> 
     <span>PC1</span><br /> 
     <div class="networkRole"> 
      <div style="margin-left: 10px; color: red;"> 
       <input class="NRoles" type="checkbox" name="networkRoles[PC1][]" value="CE" />CE 
      </div> 
      <div style="margin-left: 20px; color: #000;"> 
       <div style="width: 50px; margin-left: 20px;" class="readwrite"> 
        <input id="1" type="checkbox" name="rw[PC1][CE][]" value="Read" class="checkRW" /> 
        <span style="""margin-left: 10px;\">Read</span> 
       </div> 
       <div style="width: 50px; margin-left: 20px;" class="readwrite"> 
        <input id="2" type="checkbox" name="rw[PC1][CE][]" value="Write" class="checkRW" /> 
        <span style="""margin-left: 10px;\">Write</span> 
       </div> 
      </div> 
     </div> 
    </div> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $(".checkRW").click(function(){ 
      alert ($(this).parent().siblings().children('.checkRW').val()); 
     }); 
    }); 
    </script> 
</body> 
</html> 
0

해당 코드의 두 번째 div에 통과하려는 경우, 당신은 하나의 parent()하지 두가 필요합니다. 두 번째 parent() 통화가 한 단계 더 높아집니다.

+0

안녕하세요, 이제 질문을 조금 더 쉽게 테스트 할 수 있도록 편집해야합니다. – user2023042