嗨（我是新手，所以你需要原谅我）
我的最终目标是创建一个表单，将一些数据提交给称为解析服务器的后端数据库。到目前为止，我已经创造了我需要的一切，但似乎部分工作，但我遇到了一些相当奇怪的行为。如果我尝试按预期提交表单，它似乎什么都不做（没有数据保存到数据库中）。
经过一些测试后，我得出的结论是，当我执行以下操作时，代码只会按预期运行：
如果我在正常输入数据后第三次尝试提交表单，它似乎什么都不做。
我感到茫然，因为结果似乎很有气质。我已经检查了调试控制台，看看是否可以给我任何线索但是没有收到任何错误。
有人知道可能导致这种奇怪行为的原因吗？
（我已经隐藏了相关的解析访问密钥）。
受影响的HTML代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="js/parse_functions.js"></script>
<script type="text/javascript" src="https://npmcdn.com/parse@1.8.5/dist/parse-latest.js"></script>
</head>
<body>
<header>
<div class="jumbotron" style="background:#006272 !important">
<div class="container">
<center><img src="logo.png" width="450px" height="93px"/></center><br/>
<center><h2 style="color:#ffffff">[ALPHA] Mobile App Dashboard</h2></center>
</div>
</div>
</header>
<div class="container">
<ul class="nav nav-tabs nav-justified">
<li class="active"><a href="#Home" data-toggle="tab">Absences</a></li>
<li><a href="#About" data-toggle="tab">Push Notifications</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane fade in active" id="Home" style="padding-top:30px">
<form class="form-horizontal">
<fieldset>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="teacherName">Teacher name</label>
<div class="col-md-4">
<input id="teacherName" type="text" placeholder="e.g. Mr Smith" class="form-control input-md" required="">
</div>
</div>
<!-- Textarea -->
<div class="form-group">
<label class="col-md-4 control-label" for="workDescription">Work Description</label>
<div class="col-md-4">
<textarea id="workDescription" class="form-control" name="workDescription"></textarea>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="linkLocation">Work Link</label>
<div class="col-md-4">
<input id="linkLocation" type="text" placeholder="e.g. http://www.google.co.uk/" class="form-control" required="">
</div>
</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label" for="absence"></label>
<div class="col-md-4">
<button id="absence" name="absence" class="btn btn-success" onClick="saveData()">Submit Absence</button>
</div>
</div>
</fieldset>
</form>
</div>
<div class="tab-pane fade" id="About" style="padding-top:30px">
<form class="form-horizontal">
<fieldset>
<div class="form-group">
<label class="col-md-4 control-label" for="notificationTitle">Notification Title</label>
<div class="col-md-4">
<input id="notificationTitle" name="notificationTitle" type="text" placeholder="e.g. Mr Smith" class="form-control input-md" required="">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" for="workDescription">Notification Message</label>
<div class="col-md-4">
<textarea id="workDescription" class="form-control" id="workDescription" name="workDescription"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" for="absence"></label>
<div class="col-md-4">
<button id="absence" name="absence" class="btn btn-success" onClick="saveData()">Send Notification</button>
</div>
</div>
</fieldset>
</form>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
受影响的Javascript代码：
function saveData(){
// initializes the connection to parse with the parameters (appId, javascript key)
Parse.initialize("##########################", "##########################");
Parse.serverURL = 'https://parseapi.back4app.com/'
var absence = Parse.Object.extend("Absences");
var absence = new absence();
var name = document.getElementById('teacherName').value
var description = document.getElementById('workDescription').value
var link = document.getElementById('linkLocation').value
absence.set("name", name);
absence.set("work", description);
absence.set("link", link);
alert("test");
absence.save(null, {
success: function(gameScore) {
// Execute any logic that should take place after the object is saved.
alert("Created!");
},
error: function(gameScore, error) {
// Execute any logic that should take place if the save fails.
// error is a Parse.Error with an error code and message.
alert('Failed to create new object, with error code: ' + error.message);
}
});
}
我还制作了我的代码的简化版本来尝试调试它 - 这个版本工作正常并产生预期的结果但仍然使用相同的javascript：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Data insert test</title>
<script type="text/javascript" src="https://npmcdn.com/parse@1.8.5/dist/parse-latest.js"></script>
</head>
<body>
<input placeholder="Teacher Name" id="teacherName"/>
<br/>
<input placeholder="Work Description" id="workDescription"/>
<br/>
<input placeholder="Work link/location" id="linkLocation"/>
<br/>
<button type="button" onclick="saveData()">Save Data</button>
<script type="text/javascript">
function saveData(){
// initializes the connection to parse with the parameters (appId, javascript key)
Parse.initialize("##########################", "##########################");
Parse.serverURL = 'https://parseapi.back4app.com/'
var absence = Parse.Object.extend("Absences");
var absence = new absence();
var name = document.getElementById('teacherName').value
var description = document.getElementById('workDescription').value
var link = document.getElementById('linkLocation').value
absence.set("name", name);
absence.set("work", description);
absence.set("link", link);
absence.save(null, {
success: function(gameScore) {
// Execute any logic that should take place after the object is saved.
alert('New object created with objectId: ' + absense.id);
},
error: function(gameScore, error) {
// Execute any logic that should take place if the save fails.
// error is a Parse.Error with an error code and message.
alert('Failed to create new object, with error code: ' + error.message);
}
});
}
</script>
</body>
</html>