jQuery切換下拉列表顯示在頁面加載時隱藏div

Question

我有一個功能，當選擇一個下拉菜單時，它隱藏了一個div並可以完美地工作。

$('#allday').on('change', function () {
    $("#mytimes").toggle(this.value == 'No');
});

用戶選擇此選項后，他們將進入具有相同字段的編輯頁面。 現在，如果選擇的值為yes，我希望它以已隱藏的div開始。 如果不是，我希望它從div可見開始，並且仍然在正確的庄園中運行切換開關。 這是我在編輯頁面上的代碼，但無法正常工作。

$('#allday').on('change', function () {
    $("#mytimes").toggle(this.value == 'No');
});

if ($('#allday').val() == 'No') {
    $('#mytimes').show();
} else if($('#allday').val() == 'Yes') {
    $('#mytimes').hide();
}

這是我在php中的選擇字段

Form::Select ("Available All Day", "allday", $allDayOpt,  array('name'=>'allday', "autocomplete"=>"off"));
echo '<div id="mytimes">';
Form::Textbox("Start Time", "hourstime", array('name'=>'hourstime', 'data-format'=>"HH:mm" ,'data-template'=>"HH : mm"));
Form::Textbox("End Time", "houretime", array('name'=>'houretime', 'data-format'=>"HH:mm" ,'data-template'=>"HH : mm"));
echo '</div>';

Answer 1

我認為您應該將代碼的顯示/隱藏部分放在頁面加載后運行的函數中。

$('#allday').on('change', function () {
   $("#mytimes").toggle(this.value == 'No');
});

$(function() {
    if ($('#allday').val() == 'No')
    {
      $('#mytimes').show();
    }
    else if($('#allday').val() == 'Yes')
    {
      $('#mytimes').hide();
    }
});

Answer 2

如果我理解正確，您也許可以嘗試類似的方法

$("#mytimes").toggle(this.attr('value', 'no'));

並獲得價值

if($('#allday').attr('value') == 'Yes'){ //do something }