如何将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方法中，或者通过其他方式（然后是getElementById）获取ID。

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即可获取ID。

从输入中，您可以在form属性中获取它所属的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);
    }
}