javascript - 如何在更改下拉菜单时显示字符串

Question

在此fiddle 当选择任何一个复选框时，下拉菜单将被启用。有 4 个选项文本、 bool 值、选项和选项 1。现在，当我选择下拉选项时，另外 3 个复选框显示平均良好和较差，但什么也没有当我选择 options1 或文本或 bool 值时会发生。任何人都可以告诉我如果选择 bool 值如何显示是或否，或者在选择文本下拉列表时输入一些文本字符串

这是用于显示复选框的选项下拉列表

('#addNew .QSelect').change(function() {
    var cbs = $(this).closest('td').next().children();
    if ($('.show-checkboxes', $(this)).is(':selected')) {
        $(cbs).show();
    } else {
        $(cbs).hide();
    }
}).trigger('change');

Answer 1

试试这个代码，

var option = '<label class="checkbox-inline"><input type="checkbox" id="inlineCheckbox1" value="option1">Good</label><label class="checkbox-inline"><input type="checkbox" id="inlineCheckbox2" value="option2">Average</label><label class="checkbox-inline"><input type="checkbox" id="inlineCheckbox3" value="option3">Poor</label>';
var txt = 'Enter Some Text';
var bool = 'Yes or No';
$('#addNew .QSelect').change(function () {
    if (this.value == 'op') $(this).closest('tr').find('.out').html(option);
    if (this.value == 'txt') $(this).closest('tr').find('.out').html(txt);
    if (this.value == 'bool') $(this).closest('tr').find('.out').html(bool);
});

• 将 HTML 标记或 文本 单独编写为 JavaScript 变量，以便在用户选择选项时动态更改。
• 使用 change 事件监听器检查选择了哪个选项。然后编写您的 if 条件，以便当用户从 select 中选择选项时显示元素。

FIDDLE DEMO