javascript - 如何将 id 从父表单传递给 JavaScript

Question

假设我们有这个代码

<h:form id="#{id}">
    <h:panelGroup id="#{id}suggestionPanel">
        <h:panelGroup>
            <h:inputText value="#{searchString}"
                         rendered="#{validationId == null}"
                         id="#{id}search"
                         onkeyup="autocompleteHandler(this.value)"/>
        </h:panelGroup>
    </h:panelGroup>
</h:form>

是否有可能将表单的 ID 传递给名为“autocompleteHandler”的 JavaScript 方法，或者通过其他方式获取 ID，然后 getElementById。

Answer 1

每个输入元素都有一个form属性，该属性包含对其父表单的引用。您可以this在调用函数时将输入元素的引用传递给回调函数。然后，您可以在回调中读取传递元素的表单属性，以获取对表单的引用。表单元素将依次具有一个 ID 属性，用于保存表单 ID。

一个简单的示例如下所示：

标记：

<form id="test">
    <input type="text" onkeyup="autocompleteHandler(this);" />
</form>​

JavaScript：

function autocompleteHandler(elm) {
    alert(elm.form.id);
}​

演示

Answer 2

你总是可以使用 javascript 的 parentNode

var node = myElement;
var form = node.parentNode.parentNode;

Answer 3

在autocompleteHandler函数中，您可以简单地使用this.form.id.

form从输入中，您可以在属性中获取它所属的表单。

例子：

function autocompleteHandler(val) {
    alert(this.form.id);
}

Answer 4

您好，我想出了一种方法来获取外部形式的ID，所以我想与您分享。这并不限制您使用输入标签或其他东西。

javascript 看起来像这样。

function autocompleteHandler(elem)
{       
    var x = elem.parentNode;
    if(x.nodeName == "FORM") 
    {
        //do something with your form
    }
    else
    {
        autocompleteHandler(x);
    }
}