javascript - 如何使用Trigger函数控制div的显示或隐藏

Question

我想知道如何在这段代码中使用触发函数

    function showHusbandFun(){
    var mStatus = document.getElementById('marital_status').value;
    if(mStatus == 'Married'){
       $("#spousehide").show(); 
        $("#spousehideOther").show();       
    }else{       
       $("#spouse_name").val("");
       $("#spouse_nationality").val("");
       $("#spouse_place_of_birth").val("");
       $("#spouse_country_of_birth").val("");
       $("#spousehide").hide();
       $("#spousehideOther").hide();
    }
}

这是我控制隐藏 Div 的选择元素

<select class="form-control-input" name="marital_status" id="marital_status" onclick="removeError(this.id);" onchange="removeError(this.id); showHusbandFun();">
                    <option selected="selected" value="">Select Marital Status</option>
                    <option value="Single" <?php if($marital == 'Single'){ echo "selected";}?>> Single</option>
                    <option value="Married" <?php if($marital == 'Married'){ echo "selected";}?>> Married</option>
                    <option value="Divorced" <?php if($marital == 'Divorced'){ echo "selected";}?>> Divorced</option>
                     <option value="Widow" <?php if($marital == 'Widow'){ echo "selected";}?>> Widow</option>

                    <option value="Deceased" <?php if($marital == 'Deceased'){ echo "selected";}?>> Deceased</option>
                    <option value="Unspecific" <?php if($marital == 'Unspecific'){ echo "selected";}?>> Unspecific</option>                 
                    <option value="Child" <?php if($marital == 'Child'){ echo "selected";}?>> Child</option>
                </select>

我想在其中使用触发功能来控制显示/隐藏元素。 但问题是当页面加载时，我想在婚姻状态为已婚时显示隐藏的 Div。

Answer 1

问题是您没有在页面加载时调用该函数，并且您希望它在页面加载时工作。目前，当 SELECT 上发生更改时，会触发函数 showHusbandFun()。你可以这样做:

$(function() {
  // This is document ready function
  // This will trigger as soon as the document ready event fires
  showHusbandFun();
});

这样，将应用页面加载时的一次性更改，然后在 SELECT 更改时也将按预期工作。

如果有任何困惑，请告诉我。