6

在聚合物中，我正在尝试手动提交表格。我的表格如下所示：

<form id="myForm" on-submit="{{ submitForm }}">
    <input class="text" value="{{ someValue}}">
    <button type="submit">Submit</button>
</form>

在聚合物对象中，我有：

submitForm: function(e) {
    e.preventDefault();
}

每当我尝试执行以下操作时：

document.getElementById('myForm').submit();

表单完全忽略 on-submit 属性并将表单发布到新页面。

我正在为任何想知道我为什么要这样做的人构建一个屏幕键盘。每当有人按屏幕键盘上的 Enter 键时，我都需要提交表单。

有谁知道为什么会这样？

向您展示确切问题的 JSBin 示例（请参阅警报）：http: //jsbin.com/wadihija/2/

4

2 回答 2

5

从MDN 页面关于submit：

调用此方法时不会触发表单的 onsubmit 事件处理程序……不保证会被 HTML 用户代理调用。

click但是，调用submit类型按钮似乎有效。看这里：

http://jsbin.com/tuxac/2/edit

这是对您的 jsbin 的修改，我相信它可以满足您的要求：

http://jsbin.com/wadihija/6/edit

于 2014-04-23T17:42:22.483 回答
1

这与您尝试做的事情一致吗？这是 Shadow DOM 的一个关键特性的结果：封装。您的聚合物元素模板中的元素不在主文档中，因此无法通过document.getElementById()等方式获得。

您可以改为调用它，this.shadowRoot.getElementById()因为您的聚合物元素的原型内部链接到宿主元素。或者更好的是，利用 Polymer 免费为您提供的惊人功能。Polymer 暴露给 polymer-elements，其中包含模板中每个具有 ID 的元素的键！不需要方法调用，只需使用. 这是最终的 jsbin。thisthis.$this.$.myForm.submit()

于 2014-04-18T17:31:38.863 回答