如何使用引导类和 CSS 类答案

【问题标题】：How to use a bootrap class as well as a CSS class如何使用引导类和 CSS 类
【发布时间】：2018-10-26 07:53:41
【问题描述】：

如何使用 2 个不同的类？当用户在第一个中选择修复或另一个时，我有 2 个 HTML 选项字段。然后第二个必须出现。但它还需要一个引导类：表单控制。

<script>
    $(function() {
        $("#correctiemaatregelen").on("change", function() {
            var select_val = $(this).val();
            console.log(select_val);
            if (select_val === 'Other') {
                $("#leveranciers").removeClass("hidden");
                document.getElementById("leveranciers");
            }
            else if (select_val === 'Repair') {
                $("#leveranciers").removeClass("hidden");
                document.getElementById("leveranciers");
            }
            else {
                $("#leveranciers").addClass("hidden");
                $("#leveranciers").val("");
            }
        });
    });
</script>

Correctie maatregelen:<br>
<select name="correctiemaatregelen" class="form-control" id="correctiemaatregelen" style="width: 300px">
    <option value="--Correctie maatregel--">--Correctie maatregel--</option>
    <option value="Use">Use</option>
    <option value="Repair">Repair</option>
    <option value="Return">Return</option>
    <option value="Other">Other</option>
</select>
<br>
<select name="leveranciers" id="leveranciers" class="form-control hidden" style="width: 300px">
    <?php while ($row4 = mysqli_fetch_assoc($result4)):; ?>
        <option value="<?php echo $row4['statusname'];?>"><?php echo $row4['statusname'];?></option>
    <?php endwhile;?>
</select>

有人可以帮我解决这个（简单）问题吗？

【问题讨论】：

糟糕的编码风格。请在一个 if 语句中使用 'if (select_val === 'Other' || select_val === 'Repair')'，而不是多个 if-else 语句。

标签： html css bootstrap-4

【解决方案1】：

你不能给元素添加另一个类吗？如果这会导致问题，你必须用你自己的类覆盖一些 Bootstrap 样式

$(function() {
    $("#correctiemaatregelen").on("change", function() {
        var select_val = $(this).val();
        console.log(select_val);
        if (select_val === "Other") {
            $("#leveranciers").removeClass("hidden");
            document.getElementById("leveranciers");
        }
        else if (select_val === "Repair") {
            $("#leveranciers").removeClass("hidden");
            $('#leveranciers').addClass("YOUR_CUSTOM_CLASS");
        }
        else {
            $("#leveranciers").addClass("hidden");
            $("#leveranciers").val("");
        }
    });
});

<select name="leveranciers" id="leveranciers" class="form-control YOUR_CUSTOM_CLASS hidden" style="width: 300px">
    <?php while ($row4 = mysqli_fetch_assoc($result4)):; ?>
        <option value="<?php echo $row4['statusname'];?>"><?php echo $row4['statusname'];?></option>
    <?php endwhile;?>
</select>

【讨论】：

如何将该类添加到我的 jQuery 中？
我将代码添加到我的示例中。不确定 else-if 语句的位置是否正确，但您可以在任何需要的地方使用它。您已经在代码中使用了 addClass 方法