显示功能不适用于 Materialize 和 jQuery

debugcn 发表于 Dev

知识分子

我有两个选择，第二个是隐藏的，如果第一个选择已更改，则应该显示它，我检查了它on('change', function(){ ...并且到目前为止它正在工作。我已经检查并显示了console.log第一个选择框何时更改。

这里的问题是当我更改第一个选择框的值时，console.log 显示值但第二个选择框未显示。

我已经更新MaterializeCSS和jQuery，这是我的脚本：

<script>
    $(document).ready(function() {
        $('select').material_select();
        $('#school-list').on('change', function() {
            $('#section-list').show();
            console.log(this.value);
        });
    });
</script>

这是我的选择：

            <div class="row margin">
              <div class="input-field col s12">
                <select id="school-list" name="school-list">
                  <option value="" disabled selected>Choose your school</option>
                   ...
                </select>
                <label>School</label>
              </div>
            </div>
            <div class="row margin" style="display: none">
              <div class="input-field col s12">
                <select id="section-list" name="section-list">
                  <option value="" disabled selected>Choose your section</option>
                   ...
                </select>
                <label>Section</label>
              </div>
            </div>

巴拉辛帕尔玛

您需要显示第二个选择的父行。

你可以试试这个代码：

<script>
    $(document).ready(function() {
        $('select').material_select();
        $('#school-list').on('change', function() {
            $('#section-list').parents(".row:eq(0)").show();
            console.log(this.value);
        });
    });
</script>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。