Question

我一直在寻找没有运气的解决方案......我试图在选择框中执行隐藏选定选项的div的功能但是我不能让它正常工作，我的意思是，它的工作原理如果我用隐藏所选div的选项刷新页面，div被隐藏，我更改选项，div是可见的，但是如果我回到应该隐藏div的选项...它不会隐藏它..我做错了什么？

这是我的功能：

＆＃13;

    $(function(){

        if ( $('select#CW_Type').val() ==='APPROVED' ) {
            $('#creditLimit').addClass('hide');
            $('select#CW_Type').on("change",function() {
                $('#creditLimit').removeClass('hide');
            });
        
    };
});

＆＃13;

id＆＃34; #creditLimit＆＃34;应该隐藏的div然后再显示这是我的HTML

＆＃13;

<div>
        <label>
            Type 
            <select id="CW_Type" name="CW_Type">
                <option  value="-">-</option>
                <option  value="APPROVED">APPROVED</option>
                <option  value="LIMIT">LIMIT</option>
                <option value="MANUAL_DECISION">MANUAL DECISION</option>
                <option class="selected" value="DENIED">DENIED</option>
            </select>
        </label>
</div>

    <div id="creditLimit" class="span6">

        <label class="half">
            Credit Limit
            <input type="number" name="CW_CreditLimit" value="0" min="0" step="1" data-validate="currency">
        </label>

        <label class="half">
            Currency
            <select name="CW_Currency">
                <option value="-">-</option>
                <option value="SEK">SEK</option>
                <option value="EUR">EUR</option>
            </select>
        </label>
    </div>

<style>
.hide {display:none;}
</style>

＆＃13;

＆＃13; 提前感谢任何建议！

Answer 1

change需要select函数，然后检查值并执行逻辑：

$("select#CW_Type").change(function() {
    if ( this.value ==='APPROVED' ) {
        $('#creditLimit').addClass('hide');
    } else {
        $('#creditLimit').removeClass('hide');
    }
}).change(); //call on load

您目前有一个change处理程序 - 但它只在满足您的if条件时被绑定 - 如果没有加载，那么处理程序将永远不会被绑定。

选择选项并隐藏div jquery

1 个答案: