チェックボックス非表示Divチェックなし

Question

私は、テキストフィールドを持つチェックボックス隠しdivを持っています。チェックボックスをオンにすると、このテキストフィールドが表示されますが、チェックボックスをオフにすると、テキストフィールドが表示されません。このコード：

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

     $("input[name='checkbox1']").click(function() { 

      if ($("#checkyes1").is(":checked")) { 
       $("#dvcheckbox1").show('lainnya'); 

      } else { 

       $("#dvcheckbox1").hide('lainnya'); 
      } 



     }); 
    }); 
</script> 

<div style="margin-left: 29%; margin-top: -2%;"> 
<label for="checkyes1"> 

<input type="checkbox" id="checkyes1" name="checkbox1" value="lainnya" /> 
Lainnya 
</label> 

<div id="dvcheckbox1" style="display: none;"> 
    <?php echo $form->textField($model,'lainnya'); ?> 
</div> 
</div> 

ただし、テキストフィールドに何か値がある場合、このチェックボックスはどのようにチェックされますか？テキストフィールドが表示されます。フォームの更新では、値は表示でしたが、チェックボックスがチェックされています。 Click to show example

Answer 1

代わり.toggle(boolean)方法でchangeイベントに使用します： - より良い

1：ここではいくつかのものがあります

// on page load check of the div contains any text 
$("#dvcheckbox1").toggle(function(){ 
    var $v = $(this).find('input').val(); 
    $("input[name='checkbox1']").prop('checked', $v.trim().length !== 0) 
    return $v.trim().length !== 0; 
});  

$("input[name='checkbox1']").change(function() { 
    $("#dvcheckbox1").toggle(this.checked); 
}); 

Answer 2

私は、チェックボックスがこのように例えば

をチェックされたいですすべての要素がロードされるまで待機するため、ドキュメント準備ができていれば使用できます。

2 - ページが読み込まれたら、$（ "＃dvcheckbox1"）。hide（ 'lainnya'）の要素を非表示にする必要があります。

3 - 入力のリスナー：テキストは良いアイデアです。テキストボックスが空の場合、チェックボックスを有効にします。

してくださいは、コードの次の部分を見てみましょう：

<div> 
    <label for="checkyes1"> 
    <input type="checkbox" id="checkyes1" name="checkbox1" value="lainnya" /> 
     Lainnya 
    </label> 

    <div id="dvcheckbox1"> 
     <label for="myValuye"/> 
     <input type="text" id="myValue" name="myValue" value=""/> 
    </div> 
</div> 

<script> 
    $(document).ready(function() { 
    $("input[name='checkbox1']").click(function() { 
     // Always use some logs to check what line are you reaching. 
     console.log("Clicked checkbox!!!"); 

     if ($("#checkyes1").is(":checked")) { 
      $("#dvcheckbox1").show('lainnya'); 
     } else { 
      console.log("Value: " + $("#myValue").val()); 
      $("#dvcheckbox1").hide("lainnya"); 
     } 
    }); 

    $("#myValue").bind("change paste keyup", function() { 
     if ($(this).val() == "") { 
      $("#checkyes1").removeAttr("disabled"); 
     } else { 
      $("#checkyes1").attr("disabled", true); 
     } 
    }); 

    // First of all we hide the #dvcheckbox1 
    $("#dvcheckbox1").hide('lainnya'); 
})