2014-10-16 4 views
0

체크 박스의 모양 (스타일)을 변경하여 페이지에 더 잘 표시되도록 변경해야합니다. 각 체크 박스에는 테이블이 채워질 때 ajax로 생성되는 고유 한 ID가 있습니다.jquery로 체크 박스의 스타일을 변경하십시오.

$('#guides :checkbox').each(function() { 
    if ($(this).is(':checked')) { 
     $(this).css('border', '3px solid red'); 
    } 
}); 
}//END OF HILIGHT FUNCTION 

나는 그것이려고하고 있다는 것을 알고 나는이 코드를 사용하여 동일한 표에 설명 가격 필드를 가질 수 있어요 :

function hiLight() { 
$('#guides td.price').each(function() { 
    if ($(this).html()!= '') 
    { 
     $(this).css('border', '3px solid red'); 
    } 
}); 

및 확인란에 대한 개정 부분을 사용하려 내가 알기 위해 경고를 사용했기 때문에 체크 박스 기능으로 나는 그것이 alert($(this))을 사용하고 나중에 [object] [object]을 사용했기 때문에 경고 메시지에 어떤 포맷을해야할지 모르는 원인이되는 $(this)이라고 생각합니다. 플러그인을 사용하지 않고도이 작업이 가능합니까? 그렇다면, 누군가 올바른 방향으로 나를 가르켜 줄 수 있습니까?

+0

왜 그냥 순수 CSS에서하지 않는다? – epascarello

+0

나는 체크 된 모든 체크 박스 (페이지에 약 30+가있다)가 강조 표시되는 것을 원하지 않는다. – Jim

+1

CSS에서 할 수있는 작업 :'#guides input [type = "checkbox"] : 선택됨 {outline : 3px solid red; }' – epascarello

답변

2

먼저 입력 스타일을 지정하는 데 자바 스크립트가 필요하지 않습니다. 둘째, 확인란에는 테두리가 없지만 개요를 사용할 수 있습니다.

#guides input[type="checkbox"]:checked { 
 
    outline: 3px solid red; 
 
}
<div id="guides"> 
 
    <input type="checkbox" /> 
 
    <input type="checkbox" /> 
 
    <input type="checkbox" /> 
 
    <input type="checkbox" /> 
 
    <input type="checkbox" /> 
 
</div>

+0

개요를 사용해야한다는 것을 알지 못했습니다. 그건 속임수 였어. 감사. – Jim

관련 문제