2014-09-30 8 views
1

다음과 같은 문제가 있습니다. 3 값, 라디오 버튼 그룹 및 확인란.jQuery에서 라디오와 select 사이의 상호 작용

제 의도는 선택 상자의 세 번째 값을 선택하거나 특정 (두 번째) 라디오 버튼을 선택하면 확인란을 선택하거나 선택 해제하는 것입니다.

문제는 다음과 같습니다. 다른 라디오 버튼을 선택하면 선택 상자가 세 번째 값으로 선택 되더라도 확인란이 선택되었지만 비활성화되지 않습니다. 또는 선택 상자의 값을 변경하면 해당 라디오 단추가 선택되어 있어도 확인란이 활성화됩니다.

이 문제를 어떻게 해결할 수 있습니까?

미리 감사드립니다. 여기

<select id="sel" > 
<option id="opt1" value="0"></option> 
<option id="opt1" value="1" >nope</option> 
<option id="opt2" value="2" >nope</option> 
<option id="opt2" value="3" >this</option> 
</select> 


<input type="radio" name="11" value="first" id="one"></input> 
<input type="radio" name="11" value="second" id="two" ></input> 
<input type="checkbox" name="22" value="third" id="third" ></input> 


$("input[name='11']").change(function(){ 
if($("#one").is(":checked")) { 
    $("#third").prop("checked",true).prop("disabled","disabled"); 
} else { 
    $("#third").attr("disabled", false); 
} 
}); 

$("#sel").change(function(){ 
var m = $("#sel").val(); 
if (m == "3") { 
    $("#third").attr("checked",true).attr("disabled","disabled"); 
} else {  
    $("#third").attr("disabled", false);} 
}); 

링크 :

http://jsfiddle.net/gcxbgdhc/2/

내가 체크 박스 및/또는 비활성화 여부 등을 선택하게 할 것인지 여부를 확인하는 별도의 기능을 추천 할 것입니다
+1

ID **는 고유해야합니다. – j08691

답변

0

의 변경 이벤트에 그 함수를 호출 그래서 같은 라디오 버튼과 선택 :

$("input[name='11']").change(function(){ 
    setCheckbox(); 
}); 

$("#sel").change(function(){ 
    setCheckbox(); 
}); 

var setCheckbox = function() { 
    if ($('#sel').val() === '3' || $('#two').is(':checked')) 
    { 
     $('#third').click().attr('disabled', 'disabled'); 
    } 
    else 
    { 
     $('#third').removeAttr('checked').removeAttr('disabled'); 
    } 
}; 

JSFiddle Demo

편집 :

if 문을 추가하기 만하면됩니다. 아마 여러분이 필요로하는 사양이 더 있다면 문제를 해결할 수있는 매우 간단한 if 문이있을 것이라고 지적해야합니다.

그래서이 예에서,

$('#third').click().attr('disabled', 'disabled'); 

if (!$('#third').is(':checked')) 
    { 
     $('#third').click(); 
    } 
$('#third').attr('disabled', 'disabled'); 

에 변화와 나는 바이올린을 업데이트했습니다. 건배!

+0

먼저 별도의 기능을 가진 아이디어에 감사드립니다. . 여기서 문제는 val()이 '3'이 아니거나 라디오 버튼 (귀하의 경우 "bad")이 선택되지 않은 경우에도 확인란을 선택해야한다는 것입니다. 데모에서 먼저 확인란을 선택한 다음 val() === 3을 선택하거나 라디오 버튼 "bad"를 선택하면 확인란이 선택 취소되고 비활성화됩니다. 희망을 내 말은 무엇을 의미 – moody

+0

쉬운 수정. 게시물에 '수정'섹션을 추가했습니다. – bowheart