ошибка отключена

Я использую два флажка на странице (test1 и test2), я хочу написать код JavaScript, который отключает его, если другой флажок установлен. Он работает нормально. но мне нужен text серый цвет, когда коробка читается только.ошибка отключена

Вот мой код

<div class="auto_pick"> 
       <input name="ch0" type="checkbox" value="" id="ch0" align="left" onclick="if (this.checked) document.getElementById('ch1').disabled=true; else document.getElementById('ch1').disabled = false;" style="float:left; margin-right:5px;" /> 
       Test1</div> 
       <div class="auto_pick1"> 
       <input name="ch1" type="checkbox" value="" id="ch1" align="left" onclick="if (this.checked) document.getElementById('ch0').disabled=true; else document.getElementById('ch0').disabled = false;" style="float:left; margin-right:5px;" /> 
       Test2</div>

источник

2012-03-08 designersvsoft

Есть причина, почему вы не используете кнопки радио? У них есть такая функциональность, встроенная в них браузером, не нужно включать JS ... – Moses

Вы помечено вопрос с JQuery, я не вижу никакого кода JQuery, во всяком случае я создал скрипку для вас с JQuery на: http://jsfiddle.net/Fq32Q/

Я думаю, вы должны CSS вместо встроенные стили и использовать функции встроенного javascript.

HTML:

<div id="checkboxes"> 
    <label><input type="checkbox" id="ch0" /> Test1 </label> 
    <label><input type="checkbox" id="ch1" /> Test2 </label> 
</div>

CSS:

#checkboxes label { float:left; margin-right:5px; } 
#checkboxes label.disabled { color:#ccc; }

Javascript:

$(function() { 
    $("#checkboxes input").click(checkCheckboxes); 
}); 

function checkCheckboxes() { 
    var checked = this.checked; 
    if(checked) { 
     $("#checkboxes input").not(":checked").attr('disabled', 'disabled') 
      .parent().addClass('disabled'); 
    } else { 
     $("#checkboxes input").removeAttr('disabled').parent().removeClass('disabled'); 
    } 
}

источник

2012-03-08 06:54:05 arunes

<div class="auto_pick"> 
       <input name="ch0" type="checkbox" value="" id="ch0" align="left" onclick="myfun(this.checked);" style="float:left; margin-right:5px;" /> 
       <label id="txt1">Test1</label></div> 
       <div class="auto_pick1"> 
       <input name="ch1" type="checkbox" value="" id="ch1" align="left" onclick="myfun(this.checked);" style="float:left; margin-right:5px;" /> 
       <label id="txt2">Test2</label></div> 

<script language="JavaScript"> 
function myfun(checked) 
{ 

    if (checked) 
    { 
     document.getElementById('ch0').disabled=true; 
     document.getElementById("txt1").style.color="grey"; 
     document.getElementById("txt2").style.color="black"; 
    } 
    else 
    { 
     document.getElementById('ch0').disabled = false; 
     document.getElementById("txt2").style.color="grey"; 
     document.getElementById("txt1").style.color="black"; 
    } 
}

источник

2012-03-08 06:55:45 saba

Вы можете сделать таким образом:

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
    <title>Untitled Document</title> 

    <style type="text/css"> 
     .disabled { 
      color:#999; 
     } 
    </style> 

    <script type="text/javascript"> 
     function check(chk, id){ 
      var chk1 = document.getElementById(id); 
      if(chk.checked){ 
       chk1.disabled = true; 
       chk1.parentNode.className = "disabled"; 
      } 
      else { 
       chk1.disabled = false; 
       chk1.parentNode.className = ""; 
      } 

     } 
    </script> 

</head> 
<body> 
    <div class="auto_pick"> 
      <input name="ch0" type="checkbox" value="" id="ch0" align="left" onclick="check(this, 'ch1');" style="float:left; margin-right:5px;" /> 
      Test1</div> 
      <div class="auto_pick1"> 
      <input name="ch1" type="checkbox" value="" id="ch1" align="left" onclick="check(this, 'ch0');" style="float:left; margin-right:5px;" /> 
      Test2</div> 
</body> 
</html>

источник

2012-03-08 06:57:30 Aneesh

Привет использовать класс диапазона для текста.

<div class="auto_pick"> 
       <input name="ch0" type="checkbox" value="" id="ch0" align="left" /> 
       Test1</div> 
       <div class="auto_pick1"> 
       <input name="ch1" type="checkbox" value="" id="ch1" align="left" /> 
        <span id="text">Test2 </span></div>

Jquery код

$(function(){ 
    $("#ch0").click (function() { 

    if ($(this).is (":checked")) 
    { 
     $("#ch1").attr ("disabled" , true); 
     $("#text").css("color","grey"); 
    } 
    else 
    { 
     $("#ch1").removeAttr ("disabled" ,true); 
     $("#text").css("color","black"); 
    } 
    }); 
});

источник

2012-03-08 07:00:09 Gopesh

ошибка отключена

ответ

Смежные вопросы