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

我认为你应该将代码中的show / hide部分放在一个在页面加载后运行的函数中。

$('#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 }

Jquery切换下拉列表在页面加载

2 个答案: