отображения данных о выборе флажка

У меня есть 3 флажковотображения данных о выборе флажка

<input type="checkbox" name ="chk[]" id="inlineCheckbox1" value="Permanent">Permanent 
<input type="checkbox" name ="chk[]" id="inlineCheckbox2" value="Drive">Drive 
<input type="checkbox" name ="chk[]" id="inlineCheckbox3" value="Contract"> Contract

и DIV, который содержит 2 входа

<div id="datetime"> 
    <input type='text' class="form-control" name="datee"> 
    <input type='text' class="form-control" name="timee" > 
</div>

Checkbox Permanent и Contract может быть выбран нормально, но я хочу, что до того времени, Флажок Диска не выбран, div должен оставаться отключенным, когда пользователь выбирает «Диск», он должен иметь возможность выбирать значения из div, и если он снова отменяет флажок «Дисковод», div должен снова отключиться.

Я пытался следовать этой code, но оно не казалось, работал для меня, может кто-нибудь, пожалуйста, как это можно сделать

источник

2015-11-21 ne1902

Я хотел бы предложить вам попробовать '.show()' и '.hide()' методы, но они могут сделать моделировании страница сложная. Тем не менее, это стоит того. –

Вы можете отключить/включить контроль времени, как это:

function setDateTimeAvailability() { 
    var checked = $("#inlineCheckbox2").is(':checked'); 
    $("#datetime input").attr('disabled', !checked); 
    // Or, if you prefer to hide, do: 
    //  $("#datetime").toggle(checked); 
} 
$("#inlineCheckbox2").change(setDateTimeAvailability); 

// Make sure on page load the datetime availability is set correctly 
$(setDateTimeAvailability);

Здесь fiddle.

источник

2015-11-21 09:45:23 trincot

Это лучший ответ среди всех +10. – Prabhat

'$ (" # inlineCheckbox2 "). On (" change ", setDateTimeAvailability) .change();' – mplungjan

@mplungjan, зачем снова запускать 'change'? Это уже было вызвано взаимодействием с пользователем, и 'setDateTimeAvailability' не делает ничего, что требует его запуска. – trincot

$(document).ready(function() { 
 

 
    $("#inlineCheckbox2").change(function() { 
 
    //dissable if check box not selected 
 
    var dissable = !$(this).is(':checked'); 
 
    //set all .form-controls dissabled 
 
    $('.form-control').each(function() { 
 

 
     $(this).attr('disabled', dissable); 
 
    }); 
 

 
    }); 
 

 
    //set initail status 
 
    $("#inlineCheckbox2").trigger("change"); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" name="chk[]" id="inlineCheckbox1" value="Permanent">Permanent 
 
<input type="checkbox" name="chk[]" id="inlineCheckbox2" value="Drive">Drive 
 
<input type="checkbox" name="chk[]" id="inlineCheckbox3" value="Contract">Contract 
 

 
<div id="datetime"> 
 
    <input type='text' class="form-control" name="datee"> 
 
    <input type='text' class="form-control" name="timee"> 
 
</div>

источник

2015-11-21 09:30:58 azad

@Azzi я попробовал ур код, но его не работает – ne1902

Я отредактировал ответ, попробуйте. – azad

Попробуйте это:

Требовалась библиотека: < скрипт SRC = "// code.jquery.com/jquery-1.11.3.min.js">

$(function() { 
    HideDiv(); 
}); 

$("#inlineCheckbox2").on('change', function() { 
    HideDiv(); 
}); 

function HideDiv() { 
    if ($("#inlineCheckbox2").is(':checked')) { 
     $("#datetime").show(); 
    } else { 
     $("#datetime").hide(); 
    } 
}

источник

2015-11-21 09:46:59 Prabhat

Try ниже код:

<head> 
    <script src="http://code.jquery.com/jquery-2.0.0.min.js"></script> 
    </head> 
    <body> 
     <input type="checkbox" name ="chk[]" id="inlineCheckbox1" value="Permanent">Permanent 
     <input type="checkbox" name ="chk[]" id="inlineCheckbox2" value="Drive">Drive 
     <input type="checkbox" name ="chk[]" id="inlineCheckbox3" value="Contract"> Contract 
    <div id="datetime" style="display:none;"> 
     <input type='text' class="form-control" name="datee"> 
     <input type='text' class="form-control" name="timee" > 
    </div> 
<script> 
    $("#inlineCheckbox2").change(function(){ 

     if($(this).is(':checked')){ 
      $("#datetime").show(); 
     } else{ 
      $("#datetime").hide(); 
     } 
    }); 
    </script> 
</body>

источник

2015-11-21 09:56:24 WisdmLabs

Пожалуйста, используйте toggle ... – mplungjan

Th е короткий путь, чтобы сделать это (с точки зрения кода текста), чтобы дать Drive CheckBox скрипт JQuery для запуска, когда его значение изменяется:

onchange=$('#datetime').children().prop('disabled', 
!$(this).prop('checked'))

И пусть дата и время входа отключается при загрузке документа ,

источник

2015-11-21 10:01:47 Y2H

Проверьте это:

<script type="text/javascript"> 
$(document).ready(function(){ 

    $(".form-control").prop('disabled', true); 
    $('#inlineCheckbox2').change(function(){ 

     var checked = $("#inlineCheckbox2").is(':checked'); 
     if (checked == true) 
     { 
      $(".form-control").prop('disabled', false); 
     } 
     else 
     { 
      $(".form-control").prop('disabled', true); 
     } 
    }); 
});

Check Here

источник

2015-11-21 10:14:54 user5506189

отображения данных о выборе флажка

ответ

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