根据下拉列表

Question

默认情况下，我有一个带有选定值的下拉列表。我的想法是在该值处于默认选择状态时加载字段。我怎么做到的？我正试图在div上使用onload，但我对javascript知之甚少。

这是我的javascript代码

function check()
{
    $(document).ready(function() 
    {  
        if($('#status').val() == 'Cancelled' || $('#status').val() == 'Hold')
        {
            $('#prf').show();
            $('#lblreason').show();
            $('#lbldate').show();   
            $('#reason').show();
            $('#date').show();
            if($('#status').val() == 'Cancelled')
           {
            document.getElementById("lblreason").innerHTML = "Cancellation Reason";
            document.getElementById("lbldate").innerHTML = "Date of Cancellation";
           }    

            if($('#status').val() == 'Hold')
           {
            document.getElementById("lblreason").innerHTML = "Hold Reason";
            document.getElementById("lbldate").innerHTML = "Date of Hold";
           }  
        }
        else
        {
            $('#prf').hide();
            $('#lblreason').hide();
            $('#lbldate').hide();   
            $('#reason').hide();      
            $('#date').hide();
        }
    }
}    

HTML

<div id = "prf" onload="check()" style ="display:none;">

            <label class='listnames' id ='lblreason' style = 'width:150px; '></label>
            <input type='text' name = 'status_reason' value = '<?=$status_reason?>' id ='reason' class='required-fields' style = ""/>
            <label class='listnames' id ='date' style ='width:150px; '></label>
            <input type='date' id ='lbldate' name='status_date' placeholder='mm/dd/yyyy' autocomplete='off' value ='<?=$status_date?>' style='height: 24px; ' class='required-fields'>

            </div>

<select class="required-fields" id = "status" name="status" onload="check()" <?php if($prf_status == "Served") { echo "disabled"; } ?> >
                <option value = "Outstanding" <?php if($prf_status == "Outstanding") { echo "selected = 'selected'"; } ?> >Outstanding</option>
                <option value = "Served" disabled <?php if($prf_status == "Served") { echo "selected = 'selected'"; } ?> >Served</option>
                <option value = "Cancelled" <?php if($prf_status == "Cancelled") { echo "selected = 'selected'"; } ?> >Cancelled</option>
                <option value = "Hold" <?php if($prf_status == "Hold") { echo "selected = 'selected'"; } ?> >Hold</option>
            </select>

Answer 1

您无法在onload上使用div。

你只需要＆＃34;拔出＆＃34; check函数中的代码。

＆＃13;

＆＃13;

//function check()
//{
    $(document).ready(function() {  
        if($('#status').val() == 'Cancelled' || $('#status').val() == 'Hold')
        {
            $('#prf').show();
            $('#lblreason').show();
            $('#lbldate').show();   
            $('#reason').show();
            $('#date').show();
            if($('#status').val() == 'Cancelled')
           {
            document.getElementById("lblreason").innerHTML = "Cancellation Reason";
            document.getElementById("lbldate").innerHTML = "Date of Cancellation";
           }    

            if($('#status').val() == 'Hold')
           {
            document.getElementById("lblreason").innerHTML = "Hold Reason";
            document.getElementById("lbldate").innerHTML = "Date of Hold";
           }  
        }
        else
        {
            $('#prf').hide();
            $('#lblreason').hide();
            $('#lbldate').hide();   
            $('#reason').hide();      
            $('#date').hide();
        }
    });
//}    

＆＃13;

＆＃13;

＆＃13;

Answer 2

使用更改事件尝试此示例：

＆＃13;

＆＃13;

<TextBox wpfApplication2:Masking.Mask="^([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])(\.){0,1}$"/>

＆＃13;

$(function() {
  var prf = $('#prf'), lblreason = $('#lblreason'), lbldate = $('#lbldate');
  var funcMap = {};
  funcMap.Outstanding = function(){
    prf.hide();
  };
  funcMap.Cancelled = funcMap.Hold = function(text) {
    prf.show();
    lblreason.text(text + ' Reason');
    lbldate.text('Date of ' + text);
  };
  $('#status').on('change', function(e) {
    var val = this.value;
    funcMap[val](val);
  }).trigger('change');//on page load
});

＆＃13;

＆＃13;

＆＃13;