Javascript Firebase实时数据库不'；不响应HTML表单联系人提交

所以我是firebase和tailwind的新手，但我做了很多工作，创建了一个登录页，但是我添加的联系人和电子邮件更新表单无法正常工作。数据库只接收电子邮件更新部分，忽略数据库中的联系人

没有错误或任何东西。 当我放置联系人并按提交时，数据会转到电子邮件更新部分，然后中断！！！ 如果我删除电子邮件更新部分，联系人工作正常！

这就是数据库

<!-- Contacts -->
      <section id="Contacts" class="text-shark-100 bg-shark-500 body-font relative">
        <div class="container px-5 pt-24 pb-15 mx-auto">
          <div class="flex flex-col text-center w-full mb-12">
            <h1 class="sm:text-3xl text-2xl font-medium title-font mb-4 text-white">Contact Us</h1>
            <p class="lg:w-2/3 mx-auto leading-relaxed text-base">Have any Feedbacks & Questions, Just Go Ahead!</p>
            <p class="lg:w-2/3 mx-auto leading-relaxed text-base">Also Get Email Updates.</p>
          </div>
          <div class="lg:w-1/2 md:w-2/3 mx-auto">
            <form class="flex flex-wrap -m-2" id="Contact">
              <div class="p-2 w-1/2">
                <input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="First Name" id="FirstName" type="text" required>
              </div>
              <div class="p-2 w-1/2">
                <input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Last Name" id="LastName" type="text" required>
              </div>
              <div class="p-2 w-full">
                <input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Company" id="Company" type="Text">
              </div>
              <div class="p-2 w-full">
                <input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Email" id="Email" type="email" required>
              </div>
              <div class="p-2 w-full">
                <input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Phone Number" id="PhoneNumber" type="tel">
              </div>
              <div class="p-2 w-full">
                <textarea class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none h-48 focus:border-red-500 text-base px-4 py-2 resize-none block" placeholder="Message" id="Message" required></textarea>
              </div>
              <div class="p-2 w-full">
                <button class="flex mx-auto text-white bg-red-500 border-0 py-2 px-8 focus:outline-none hover:bg-red-600 hover:shadow-2xl rounded text-lg" type="submit">Let's Talk</button>
              </div>
              <div class="p-2 w-full pt-8 mt-8 border-t border-shark-300">
              </div>
            </form>
          </div>
        </div>
      </section>
      <!-- News -->
      <section id="News" class="text-shark-100 bg-shark-500 body-font">
        <div class="container px-5 pt-15 pb-24 mx-auto">
          <div class="flex flex-col text-center w-full mb-12">
            <h1 class="sm:text-3xl text-2xl font-medium title-font mb-4 text-white">Get Early Access</h1>
            <p class="lg:w-2/3 mx-auto leading-relaxed text-base">Subscribe to our emails & get notified about early updates.</p>
          </div>
          <form id="Subscribe" class="flex lg:w-2/3 w-full sm:flex-row flex-col mx-auto px-8 sm:px-0">
            <input class="flex-grow w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2 mr-4 mb-4 sm:mb-0" placeholder="Full Name" type="text" id="Name" required>
            <input class="flex-grow w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2 mr-4 mb-4 sm:mb-0" placeholder="Email" type="email" id="EmailUpdates" required>
            <button class="text-white bg-red-500 border-0 py-2 px-8 focus:outline-none hover:bg-red-600 hover:shadow-2xl rounded text-lg" type="submit">Subscribe</button>
          </form>
        </div>
      </section>

这里是Javascript

---

**请告诉任何我甚至不了解发生了什么的人**

您需要更密切地跟踪数据流。在“源”选项卡中，使用浏览器的开发工具放置断点并检查各个点上的值。或者将

console.log

语句放入各种函数中。通过

getInputVal（）

获取的数据是否正确？它是否正确地到达

saveMessage（）

？如果你找到了故障点，你就会知道错误在哪里了。我尝试了所有的方法，包括console.log，它都能工作。有这么多的错误或任何东西，一切工作，但数据库从联系人的数据，并把它在电子邮件更新部分。我不明白为什么。如果我禁用电子邮件订阅部分，其余的工作正常！听起来您需要找到一种方法来记录数据库活动。在MySQL中，您可以打开常规日志并查看命中它的每个查询。如果问题不在html和js中（如果它正确提交了表单数据），那么问题一定在db层。我尝试了console.log，但js没有出错。您需要更密切地跟踪数据流。在“源”选项卡中，使用浏览器的开发工具放置断点并检查各个点上的值。或者将

console.log

语句放入各种函数中。通过

getInputVal（）

获取的数据是否正确？它是否正确地到达

saveMessage（）

？如果你找到了故障点，你就会知道错误在哪里了。我尝试了所有的方法，包括console.log，它都能工作。有这么多的错误或任何东西，一切工作，但数据库从联系人的数据，并把它在电子邮件更新部分。我不明白为什么。如果我禁用电子邮件订阅部分，其余的工作正常！听起来您需要找到一种方法来记录数据库活动。在MySQL中，您可以打开常规日志并查看命中它的每个查询。如果问题不在html和js中（如果它正确提交表单数据），那么问题一定在db层中。我尝试了console.log，但js没有错误。

// Your web app's Firebase configuration
var firebaseConfig = {
  apiKey: "xxxx",
  authDomain: "xxxx",
  databaseURL: "xxxx",
  projectId: "xxxx",
  storageBucket: "xxxx",
  messagingSenderId: "xxxx",
  appId: "xxxx",
  measurementId: "xxxx"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
firebase.analytics();

// Reference messages collection
var contactRef = firebase.database().ref('Contact');

// Listen for a submit

document.getElementById('Contact').addEventListener('submit', submitForm);

// Submit form
function submitForm(e){
  e.preventDefault();


  // Get values
  var firstname = getInputVal('FirstName');
  var lastname = getInputVal('LastName');
  var company = getInputVal('Company');
  var email = getInputVal('Email');
  var phone = getInputVal('PhoneNumber');
  var message = getInputVal('Message');

  // Save Contact
  saveMessage(firstname, lastname, company, email, phone, message);

  // Clear form
  document.getElementById('Contact').reset();

}

// Function to get get form values
function getInputVal(id){
  return document.getElementById(id).value;
}

// Save message to firebase
function saveMessage(firstname, lastname, company, email, phone, message){
  var newContactRef = contactRef.push();
  newContactRef.set({
    firstname: firstname,
    lastname: lastname,
    company:company,
    email:email,
    phone:phone,
    message:message
  });
}

// Reference messages collection
var emailupdatesRef = firebase.database().ref('EmailUpdates');
  
// Listen for a submit
  
document.getElementById('Subscribe').addEventListener('submit', submitForm);
  
// Submit form
function submitForm(e){
  e.preventDefault();

  // Get values
  var name = getInputVal('Name');
  var email = getInputVal('EmailUpdates');
  
  // Save Email Updates
  saveMessage(name, email);

  // Clear form
  document.getElementById('Subscribe').reset();
}

// Function to get form values
function getInputVal(id){
    return document.getElementById(id).value;
  }

// Save message to firebase
function saveMessage(name, email){
    var newEmailUpdatesRef = emailupdatesRef.push();
    newEmailUpdatesRef.set({
      name: name,
      email:email
    });
  }