Я пытаюсь использовать флажок в качестве условия

Question

Итак, я пытаюсь сделать следующее: пользователь в основном выбирает дату с типом ввода = 'date', но если пользователь нажимает флажок рядом с ним, тип ввода = 'date' будет заменен на текущая дата и время. И вот код, который я написал:

        function myFunction() {
            if($("#checkbox").checked == true) {
                $("#input_date").hide();
                var now = new Date();
                $("#current_datetime").text(now).show();
            } else if($("#checkbox").checked == false) {
                $("#current_datetime").hide();
                $("#input_date").show();  
            }
        }

В коде #checkbox в html у меня есть onClick="myFunction".

Кроме того, #current_datetime, который является простым текстом в теге span, и #input_date расположены в одном и том же месте на странице.

Но функция просто не будет работать , Нет никаких изменений, независимо от того, сколько раз я нажимал на флажок.

Я очень благодарен за вашу помощь заранее.

Answer 1

Вы можете отформатировать свою дату в соответствии с нижеприведенной информацией, затем вы можете использовать ее в качестве типа ввода = 'date'

$(document).ready(function(){
$("#currentDate").on('change',function(){
   var checked=$(this)[0].checked;
   console.log(checked)
   if(checked){
     var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth()+1;
    var yyyy = today.getFullYear();
    if(dd<10){
        dd='0'+dd;
    } 
    if(mm<10){
        mm='0'+mm;
    } 
     today = yyyy+'-'+mm+'-'+dd; 
     $("#Date").val((today))
   }
   else{
   $("#Date").val('')
   }
})
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='date' id='Date'/><input type='checkbox' id='currentDate'/>

Answer 2

надеюсь, это поможет вам

<input type="date" id="input_date">
<input type="checkbox" id="checkbox" >
<p id="current_datetime"></p>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>


<script>
$(document).ready(function(){
    $('#checkbox').click(function(){
        if($(this).prop("checked") == true){
            $("#input_date").hide();
            var now = new Date();
            $("#current_datetime").text(now).show();
        }
        else if($(this).prop("checked") == false){
            $("#current_datetime").hide();
            $("#input_date").show(); 
        }
    });
});
</script>

Answer 3

Проверено это свойство, вы можете прочитать значение с помощью .prop (). Также для изменения входного значения вам нужно использовать .val ().

    <script type="text/javascript">
     function myFunction() {
        if($("#checkbox").prop('checked') == true) {
            $("#input_date").hide();
            var now = new Date();
            $("#current_datetime").val(now).show();
        } else if($("#checkbox").prop('checked') == false) {
            $("#current_datetime").hide();
            $("#input_date").show();  
        }
    }
</script>