Question

感谢post我已经实现了隐藏下拉菜单，当选择了一个选择字段的值时：

$(function () {
           var selectField = $('#id_type_contract'),
           verified = $('#id_mod_contracts');

        function toggleVerified(value) {
            value == 'Modification' ? verified.show() : verified.hide();
        }

        // show/hide on load based on pervious value of selectField
        toggleVerified(selectField.val());

        // show/hide on change
        selectField.change(function() {
            toggleVerified($(this).val());
        });
    });
        })(django.jQuery);

但它并没有像我想的那样工作：Image，因为它仍然是它的标签，并且“添加”＃39;按钮（绿十字）。所以，我认为最好的方法是隐藏整个div，我是对的吗？

HTML

<div class="form-row field-mod_contracts">
<div>
<label for="id_mod_contracts">Modification:</label>
<select id="id_mod_contracts" name="mod_contracts" style="display: none;">
    <option value="" selected="selected">---------</option>
    <option value="4">Contract foo</option>
    <option value="7">Contrato bar</option>
    <option value="8">contract CCCC</option>
</select><a href="/admin/app/contract/add/?_to_field=id" class="add-another" id="add_id_mod_contracts" onclick="return showAddAnotherPopup(this);"> <img src="/static/admin/img/icon_addlink.gif" width="10" height="10" alt="Add another"></a>
</div>
</div>

我如何调整上述JavaScript函数？还有其他更好的选择吗？

Answer 1

两个隐藏整个输入部分，更改：

verified = $('#id_mod_contracts');

到

verified = $('.field-mod_contracts');

Answer 2

要么像@Aumo所建议的那样，除非你有更多元素的类field-mod_contracts（然后它会隐藏所有元素）。

如果是这样，您可以使用：

verified = $('#id_mod_contracts').parent();

这将选择最里面的div

或：

verified = $('#id_mod_contracts').closest('.field-mod_contracts');

这将选择最外层的

隐藏/显示div部分 - 选择选项

2 个答案: