#javascript #firebase
#javascript #firebase
Вопрос:
Я нашел это, когда отправлял свою форму
что я могу сделать, чтобы моя отправка прошла успешно
это работает нормально, когда я использую тип ввода = текст
для меня лучше предоставить полный код
Я новичок в программировании.
Я удалил многие опции, поскольку в них слишком много кодов и слишком мало деталей
Я не нашел ошибки в своей консоли, но данные по-прежнему не могут быть отправлены в базу данных firebase
<form id="ConForm">
<Label class="red">amp;nbsp學生稱呼:</Label>
<input type="text" name="name" id="name"><br>
<Label class="red">amp;nbsp性別:</Label>
<select name="sex1" id="sex1" >
<option value="男">男</option>
<option value="女">女</option>
</select><br>
<Label class="red">amp;nbsp就讀年級:</Label>
<select name="year" id="year">
<option value="幼稚園">幼稚園</option>
<option value="小一">小一</option>
</select><br>
<Label class="red">amp;nbspWhatsapp號碼:</Label>
<input type="number" name="phone" placeholder="將以此電話進行聯絡" id="phone"><br>
<Label class="red">amp;nbsp補習地區:</Label>
<select name="location" id="location">
<option value="中西區">中西區</option>
<option value="灣仔區">灣仔區</option>
</select><br>
<Label class="red">amp;nbsp導師性別要求:</Label>
<select name="sex2" id="sex2">
<option value="男">男</option>
<option value="女">女</option>
</select><br>
<Label class="red">amp;nbsp時薪hkd:</Label>
<select name="salary" id="salary">
<option value="100-150">100-150</option>
</select><br>
<Label class="red">amp;nbsp每堂幾小時:</Label>
<select name="hour" id="hour">
<option value="1.5">1.5</option>
<option value="2">2</option>
</select><br>
<Label class="red">amp;nbsp科目:</Label>
<select name="subject" id="subject">
<option value="中國語文">中國語文</option>
<option value="英國語文">英國語文</option>
</select><br>
<Label class="red">amp;nbsp補習時間:</Label>
<select name="time" id="time">
<option value="星期一">星期一</option>
<option value="星期二">星期二</option>
</select><br>
<p class="full">
<Label class="red">amp;nbsp其他要求:</Label>
<textarea name="message" rows="2" id="message"></textarea>
</p>
<p class="full">
amp;nbspamp;nbspamp;nbsp<Button type="submit">提交</Button><span>amp;nbspamp;nbspamp;nbsp *按一下「提交」即表示您同意服務條款 和私隱政策</span><br>
</p>
</form>
</div>
</div>
javascript
//Reference message collection
var messageRef = firebase.database().ref('posts');
//listen for form submit
document.getElementById('ConForm').addEventListener('submit',submitForm);
//submit form
function submitForm(e){
e.preventDefault();
//get value
var name=getInputVal('name');
var sex1=getInputVal('sex1');
var sex2=getInputVal('sex2');
var location=getInputVal('location');
var salary=getInputVal('salary');
var hour=getInputVal('hour');
var subject=getInputVal('subject');
var time=getInputVal('time');
var year=getInputVal('year');
var phone=getInputVal('phone');
var message=getInputVal('message');
//Save message
saveMessage(name,year,phone,message,sex1,sex2
,location,salary,hour,subject,time);
}
//function to get form value
function getInputVal(id){
return document.getElementById(id).value;
}
//Save message to firebase
function saveMessage(name,year,phone,message,sex1,
sex2,location,salary,hour,subject,time){
var newMessageRef = messageRef.push();
newMessageRef.set({
姓名: name,
級別: year,
WhatsApp號碼: phone,
其他要求: message,
性別:sex1,
導師性別要求:sex2,
地區:location,
時薪:salary,
每堂幾小時:hour,
科目:subject,
補習時間:time,
})
}
Ответ №1:
Вы используете функцию submitForm
до ее объявления. JS интерпретируется, а не компилируется, что означает, что порядок определения имеет значение.
Определите свою функцию function submitForm(e){...}
перед ее использованием document.getElementById('ConForm').addEventListener('submit',submitForm);
//Reference message collection
var messageRef = firebase.database().ref('posts');
//listen for form submit
//submit form
function submitForm(e) {
e.preventDefault();
//get value
var name = getInputVal('name');
var sex1 = getInputVal('sex1');
var sex2 = getInputVal('sex2');
var location = getInputVal('location');
var salary = getInputVal('salary');
var hour = getInputVal('hour');
var subject = getInputVal('subject');
var time = getInputVal('time');
var year = getInputVal('year');
var phone = getInputVal('phone');
var message = getInputVal('message');
//Save message
saveMessage(name, year, phone, message, sex1, sex2
, location, salary, hour, subject, time);
}
//function to get form value
function getInputVal(id) {
return document.getElementById(id).value;
}
//Save message to firebase
function saveMessage(name, year, phone, message, sex1,
sex2, location, salary, hour, subject, time) {
var newMessageRef = messageRef.push();
newMessageRef.set({
姓名: name,
級別: year,
WhatsApp號碼: phone,
其他要求: message,
性別: sex1,
導師性別要求: sex2,
地區: location,
時薪: salary,
每堂幾小時: hour,
科目: subject,
補習時間: time,
})
}
document.getElementById('ConForm').addEventListener('submit', submitForm);
Комментарии:
1. Это не проблема, это помогло бы сделать код более правильным, но он будет работать, даже если не реализован.
2. @Rsmusic ‘это будет работать, даже если [функция обработчика событий] не реализована’ на самом деле, в JS использование неопределенных функций приводит к ошибкам неопределенных функций:
Uncaught ReferenceError: submitForm is not defined
3. К сожалению, вы ошибаетесь, просто протестируйте его в браузере.
Ответ №2:
Вы должны убедиться, что весь ваш HTML загружен и готов перед использованием javascript.
По сути, вам нужно вставить свой скрипт после вашего html.
Комментарии:
1. Спасибо, теперь вам нужно нажать зеленую кнопку слева от моего ответа для проверки 🙂