引用当前正在使用的HTML选择控件

Referencing the HTML select control currently being used

本文关键字：HTML 选择 控件 引用      更新时间：2023-09-26

我有一个javascript程序，通过在输入(文本(框中键入正则表达式来过滤HTML选择控件中的内容列表。我可以做以下操作来正确过滤特定的选择控件：

$(function() {
    $('input[data-filterable]').keyup(
        function() {
            filter = new filterlist(document.myform.myselect);   
            filter.set(this.value);
        });
});

但我使用了一个自定义属性(现在可以在HTML5中完成(，称为datafilterable。属性将存储要筛选的选择控件的名称，以便JS可以使用控件的名称来筛选列表。这将是一个好主意，因为我将有一个通用的功能来过滤任何选择框，而不是一个特定的框。

你知道我该怎么做吗？我需要像这样的HTML：

<input data-filterable='{"to":"#selectbox1"}' size="30" type="text" />

但我不确定我在这里到底在做什么，以及如何处理JS。

谢谢各位：(。

试试这个：

<input data-filterable="#selectbox1" size="30" type="text" />
$(function() {
    $('input[data-filterable]').keyup(
        function() {
            filter = new filterlist($($(this).data('filterable'))[0]);   
            filter.set(this.value);
        });
});

分解表达式$($(this).data('filterable'))[0]:

$(this)将this封装在jQuery封装器中。在我们的上下文中，由于它是一个jQuery keyup事件处理程序，this引用了<input>DOM节点。

CCD_ 6检索作为字符串的CCD_ 7属性的内容。在我们的例子中，它是#selectbox1。

之后，这个字符串作为选择器传递给jQuery：$($(this).data('filterable'))。

最后，我们取返回数组的第0个元素，它应该是目标selectbox的DOM元素。当然，如果没有一个适合选择器的选择框，这将非常糟糕地失败。如果怀疑这是一个真实的场景，请首先检查返回数组的.length。

相关文章：