1

用于仅onclick使用 a 添加事件button并收集数据,甚至不需要 a form element,但HTML5您可以利用用户提交表单时显示的错误检查和默认消息。

<input type="email" id="addEmail" name="addEmail"  placeholder="user@sample.com" value="" required="" title="" />

由于类型是email并且存在一个require属性,因此浏览器将检查结构良好的电子邮件地址onsubmit。如果值失败,则输入下方会显示一条消息,指示用户必须修复该值。

例如,您还可以使用正则表达式

<input type="password" id="addPassword" name="addPassword"  placeholder="Password" value="" required="" pattern="^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[0-9a-zA-Z]{8,}$"  title="" />

你一起拥有

<script>
function userAdd(){
    *** xmlhttprequest code *******
    return false;
}
</script>

<html>
<form action="admin" method="post" onsubmit="return userAdd();">
<input type="email" id="addEmail" name="addEmail"  placeholder="user@sample.com" value="" required="" title="" />
<input type="password" id="addPassword" name="addPassword"  placeholder="Password" value="" required="" pattern="^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[0-9a-zA-Z]{8,}$"  title="" />
<input type="submit" value="Submit" />
</form>
</html>

当我动态生成表单元素时,我需要附加一个事件处理程序:

f = document.createElement('form');

addEventHandler(f,'submit', function(){userAdd()});

function addEventHandler(elem,eventType,handler) {
     if (elem.addEventListener)
         elem.addEventListener (eventType,handler,false);
     else if (elem.attachEvent)
         elem.attachEvent ('on'+eventType,handler); 
    }
}

我想保留默认提交功能的原因是内置的 HTML5 功能。

使用 EventHandler 动态添加取消提交时,如何创建与 onsubmit="return groupAdd()" 相同的功能?

4

1 回答 1

1

对于带有 DOM2 API 的 HTML5:

f.addEventListener('submit', function(e) { if (!userAdd()) { e.preventDefault(); } });

于 2014-07-26T12:58:10.080 回答