Javascript 在JSFIDLE中，运行时错误消息“quot；错误"；：&引用；缺少键：标题“；什么意思？

我有一个表单在提交时生成了这个错误消息：“error”：“key missing:title”。我不明白这是什么意思

运行时，表单将正确显示在输出窗格中。提交时，输出窗格变为黑色，错误消息以黑色显示。人们必须选择它来阅读它

JavaScript（在相关部分）：

$(document).ready( function() {
  document.addEventListener("submit", (e) => {
  var formData = $( 'form' ).serializeArray();
  var classes =  buildClasses(formData);
  });  //  end arrow fn callback on event listener
});  // end doc.ready

function buildClasses(fd) {
  ...
}  // end def fn buildClasses

我的JavaScript表示所有代码（不仅仅是我在这里复制的代码）在语法上都是正确的

在下面的代码片段中，在提交时，控制台会闪烁一些消息约十分之一秒，然后消失。此错误消息保留在结果窗格中：“自定义错误模块无法识别此错误。”

片段

PS：有没有办法隐藏代码片段，使其在默认情况下不会显示在问题中

$（文档）.ready（函数（）{
文件。附录列表（“提交”、（e）=>{
e、 防止违约；
var formData=$（'form'）.serializeArray（）；
log（'log formData:'，formData）；
变量类=构建类（formData）；
//可更新（类）；
log（'生成后的日志类：'，类）；
})；//事件侦听器上的结束箭头fn回调
}); // 结束文件准备好了吗
函数构建类（fd）{}

用于构建类的jdfide
名字
姓
电子邮件地址
08:30主讲人
不确定
出席
不出席
09:00上课
不确定
A房间
B房间
10:30上课
不确定
A房间
B房间

在JSFIDLE上，您有一个运行的

submit

事件侦听器，但不阻止表单提交。因此，在运行

buildClasses

之后，您已经创建了一个

classes

对象，但是表单提交仍在进行中。因为iframe src是

https://fiddle.jshell.net/_display/

表单提交将表单数据发送到该地址（例如

fname: 
lname: 
email: 
select: 
select: unsure
select: unsure

)

但是，当然，JSFiddle不知道这意味着什么。据推测，fiddle.jshell.net将表单提交用于其他用途（它可能需要可用于创建响应iframe文档的数据），并且它需要的表单提交应该具有

标题

键

类似地，在Stack Overflow的snippet editor上，您正在将该数据提交给，但Stack Snippets不需要此类表单数据—它只需要可用于创建代码段的数据（具体来说，是：HTML、CSS、JS、Babel和Console的键）。因此，它会给您一条错误消息

这只是在在线Javascript编辑器中提交表单的结果，而在线Javascript编辑器并不期望这样的表单提交。在您的实际站点上，假设您的站点已设置为正确处理表单提交，则这不重要

如果您想在在线Javascript编辑器上演示表单提交将提交正确的数据，而不实际提交表单，那么只需使用

preventDefault

处理程序中的

submit

阻止表单提交，例如

document.addEventListener("submit", (e) => {
  var formData = $('form').serializeArray();
  console.log('log formData : ', formData);
  var classes = buildClasses(formData);
  // updageTable(classes);
  console.log('log classes after build : ', classes);
  e.preventDefault();
  // ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
}); //  end arrow fn callback on event listener

$（文档）.ready（函数（）{
文件。附录列表（“提交”、（e）=>{
var formData=$（'form'）.serializeArray（）；
log（'log formData:'，formData）；
变量类=构建类（formData）；
//可升级（类）；
log（'生成后的日志类：'，类）；
e、 预防默认值（）；
})；//事件侦听器上的结束箭头fn回调
}); // 结束文件准备好了吗
函数构建类（fd）{
var时隙=['0830'、'0900'、'1030'、'1245'、'1415'、'1545']；
var课堂=['chapel'，'A'，'B'，'C'，'D'，'E'，'F'，'I']；
var ts=“”；
var rm=“”；
var startIndex=3；
var类=[]；
log（'log classes post def:'，classes）；
如果（fd[startIndex].value==“出席”）{
fd[startIndex]。值='chapel'；
}否则{
fd[startIndex]。值='不确定'；
}
对于（var i=startIndex；i

用于构建类的jdfide
名字
姓
电子邮件地址
08:30主讲人
不确定
出席
不出席
09:00上课
不确定
A房间
B房间
10:30上课
不确定
A房间
B房间

JSFIDLE对我来说运行时没有错误（忽略404）。如果添加

e.preventDefault（）

则不会出现错误，控制台中也不会出现错误。您没有阻止表单提交。感谢@RandyCasburn花时间指出这一点。感谢@Titus花时间指出这一点。天哪，我是不是很愚蠢？我知道，

prevent

属于那里。我盯着它看了一个小时，没有发现问题所在。非常感谢您的两个答案，以及精彩的解释。