单击引导程序4中的切换按钮后未返回值

Question

我正在使用此Toggle Button。用户界面工作正常。但是，我有一个jQuery问题，即单击“提交”按钮后，唯一的第一个值是通过单击ON切换键返回的。

    <label class="switch">
        <input id="toggle-event" type="checkbox" data-toggle="toggle">
        <div class="slider round">
            <span class="on" id="test_status" value="Active">ON</span>
            <span class="off" id="test_status" value="Inactive">OFF</span>
        </div>
    </label>
    <button type="button" id="btn_edit_device" class="btn btn-block btn-info">SUBMIT</button>

    $("#btn_edit_device").on("click",function(){

        if ($('input[type="checkbox"]').prop('checked',true)){ 
            status =  $("#test_status").val("Active"); 
            console.log("Active")
        }
        else { 
            status = $("#test_status").val("Inactive"); 
            console.log("Inactive")
        }

    });

Answer 1

问题在这里if ($('input[type="checkbox"]').prop('checked',true)){

您应该进行更改以能够正确获得价值，如下所示。

if ($('input[type="checkbox"]').prop('checked')){

$("#btn_edit_device").on("click",function(){
        if ($('input[type="checkbox"]').prop('checked')){ 
            status =  $("#test_status").val("Active"); 
            console.log("Active")
        }
        else { 
            status = $("#test_status").val("Inactive"); 
            console.log("Inactive")
        }

    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="switch">
        <input id="toggle-event" type="checkbox" data-toggle="toggle">
        <div class="slider round">
            <span class="on" id="test_status" value="Active">ON</span>
            <span class="off" id="test_status" value="Inactive">OFF</span>
        </div>
    </label>
    <button type="button" id="btn_edit_device" class="btn btn-block btn-info">SUBMIT</button>