使用jquery从列表框中获取某个下拉列表中的第一个项目

本文关键字：下拉列表 项目 第一个 获取 jquery 列表 使用 | 更新日期: 2023-09-27 18:29:34

我有一个包含多个下拉列表和一个列表框的表单，表单末尾是一个"确认页面"，显示输入的所有数据。我遇到的问题是，列表框允许用户选择多个项目当我实现jquery来处理这个问题时，它也适用于下拉框。

这会导致确认页面显示"1.Mr"，而不是例如称呼下拉框中的"Mr"。

但是列表框项目显示正确，下面是我的jquery。。。

  var displayConfirm = function () {
            $('.display-value', form).each(function () {
                var input = $('[name="' + $(this).attr("data-display") + '"]',form);
                if (input.is(":text") || input.is("textarea")) {
                    $(this).text(input.val());
                } else if (input.is("select")) {
                    var html = '<ol>';
                    input.find('option:selected').each(function () {
                        html += '<li>' + $(this).text() + '</li>';
                    });
                    html += '</ol>';
                    $(this).html(html);
                }
            });
        };

有没有一种方法可以改变为包括。。

 else if (input.is("select") && input.val() < 1 ) {

感谢

使用jquery从列表框中获取某个下拉列表中的第一个项目

Listbox辅助对象被呈现为<select multiple="multiple">。因此，要选择正确的值，必须检查所找到的select标记中的multiple属性。

$(input.is('select')){
    if (input.attr('multiple') == "multiple") {
        var html = '<ol>';
        input.find('option:selected').each(function () {
            html += '<li>' + $(this).text() + '</li>';
        });
        html += '</ol>';
        $(this).html(html);
    } else {
        $(this).text(input.val())
    }
}

理想情况下，您还可以丢失else条件，使其成为一个更通用的条件，在该条件下，您不检查任何其他类型。因此，代码的更新版本将看起来像这个

if (input.is("select") && input.attr('multiple') == "multiple") {
    var html = '<ol>';
    input.find('option:selected').each(function () {
        html += '<li>' + $(this).text() + '</li>';
    });
    html += '</ol>';
    $(this).html(html);
} else {
    $(this).text(input.val());
}

你可以在这里找到一把正在工作的小提琴。

相关文章：