Question

我有一个文本框，用作下拉列表（使用Css）。此文本框的作用类似于google suggest。当我输入一个字母时，文本框将填充与输入字母匹配的单词。在表单提交上，我需要编写一个验证，检查用户是否从列表中选择了一个项目。如果没有显示错误消息。

HTML：

<ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content ui-corner-all" id="ui-id-2" tabindex="0" style="display: none; width: 251px; top: 143.59375px; left: 28.1875px;">
   <li class="ui-menu-item" role="presentation"><a id="ui-id-7" class="ui-corner-all" tabindex="-1">Mau Ramir - mau.ramir@cor.tls.com</a></li>
   <li class="ui-menu-item" role="presentation"><a id="ui-id-8" class="ui-corner-all" tabindex="-1">Mah Gov - mg@gmail.com</a></li>
   <li class="ui-menu-item" role="presentation"><a id="ui-id-9" class="ui-corner-all" tabindex="-1">Mdu ira - mk@gmail.com</a></li>
   <li class="ui-menu-item" role="presentation"><a id="ui-id-10" class="ui-corner-all" tabindex="-1">Mdh Kn - mn@gmail.com</a></li>
</ul>

这是我到目前为止所尝试的（但不起作用）：

$.validator.addMethod("validSmartSrch", function (value, element) {
            var notValid = 0;
            var carts = $("[id^='ui-id-']").children()
            valid = false;

            if (value == $.inArray(value, carts)) {
                valid = true
            }

        return valid;
    }, 'Please select at least on item from the list');

Answer 1

试试这个：

$.validator.addMethod("validSmartSrch", function (value, element) {
    var carts = $("[id^='ui-id-']").map(function() {
        return $(this).text();
    }).get();

    return $.inArray(value, carts) != -1;
}, 'Please select at least one item from the list');

您不需要致电.children()，因为与该选择器匹配的元素没有子代。您需要将元素列表转换为字符串数组。 .map()将获取每个文本的文本并返回它们的jQuery集合，.get()将其转换为普通数组。

$.inArray只返回数组中元素的位置，因此您需要将其与-1进行比较，而不是value。

Answer 2

我终于以这种方式解决了问题。

  $.validator.addMethod("validSmartSrch", function (value, element) {

                var items = [];
                var valid = false;
                // push all the values into an array
                $("[id^='ui-id-']").each(function (i, e) {
                    items.push($(e).text());
                });

                // check if the item exist in the array
                var itemIndex = $.inArray(value, items);

                if (itemIndex != -1) {
                    valid = true;
                }  
                return valid;
            }, 'Please select at least one item from the list');

验证从列表中选择至少一个项目的方法

2 个答案: