<!-- Модальное окно успешного результата -->
<div id="modal-success" class="modal">
<div class="modal-content">
<span class="close">×</span>
<h2>Успех!</h2>
<p>Данные успешно отправлены.</p>
</div>
</div>
<!-- Модальное окно с ошибкой -->
<div id="modal-error" class="modal">
<div class="modal-content">
<span class="close">×</span>
<h2>Ошибка!</h2>
<p>Произошла ошибка при отправке данных.</p>
</div>
</div>
// При успешной отправке данных
const showSuccessModal = () => {
document.getElementById("modal-success").style.display = "block";
};
// При ошибке отправки данных
const showErrorModal = () => {
document.getElementById("modal-error").style.display = "block";
};
// Закрытие модального окна при клике на крестик
const closeButtons = document.getElementsByClassName("close");
for (let i = 0; i < closeButtons.length; i++) {
closeButtons[i].addEventListener("click", function() {
const modal = this.parentElement.parentElement;
modal.style.display = "none";
});
}
//пример обработки ответа с формы
const form = document.querySelector('form');
form.addEventListener('submit', async (event) => {
event.preventDefault();
const formData = new FormData(form);
const response = await fetch('/api/submit-form', {
method: 'POST',
body: formData
});
if (response.ok) {
const result = await response.json();
// обработка успешного ответа
console.log(result);
} else {
const error = await response.text();
// обработка ошибки
console.error(error);
}
});
// а это пример с promise .then
const form = document.getElementById("myForm");
form.addEventListener("submit", function(event) {
event.preventDefault(); // Предотвращаем отправку формы по умолчанию
// Получаем данные из формы
const formData = new FormData(form);
// Отправляем данные на сервер с помощью Fetch API
fetch("URL_СЕРВЕРА", {
method: "POST",
body: formData
})
.then(function(response) {
if (response.ok) {
showSuccessModal(); // Показываем модальное окно успешного результата
} else {
showErrorModal(); // Показываем модальное окно с ошибкой
}
})
.catch(function(error) {
console.error("Ошибка:", error);
showErrorModal(); // Показываем модальное окно с ошибкой
});
});
.modal {
display: none; /* Скрываем модальное окно по умолчанию */
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.5);
}
.modal-content {
background-color: #fefefe;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
}
.close {
float: right;
font-size: 28px;
font-weight: bold;
cursor: pointer;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
MathJax.typesetPromise().then(() => {
// Рендеринг MathJax завершен
// Выполните другие действия здесь
});
$http->setHeaders(
array(
"Accept" => "application/json",
"Content-Type" => "application/json; charset=UTF-8",
"Cache-Control" => "no-cache, no-store, must-revalidate",
"Authorization" => "Basic " . base64_encode($login . ":" . $password)
)
);
<button onclick="connectToDatabase()">Подключиться к базе данных</button>
<script>
function connectToDatabase() {
fetch('/connect')
.then(response => response.text())
.then(data => {
console.log(data); // Вывод ответа от сервера в консоль
})
.catch(error => {
console.log('Ошибка при подключении к базе данных:', error);
});
}
</script>
// index.js (серверное приложение с использованием Express)
const express = require('express');
const app = express();
// Функции для подключения к базе данных
// ...
// Обработка GET-запроса на /connect
app.get('/connect', (req, res) => {
// Вызов функции подключения к базе данных
// ...
// Отправка ответа клиенту
res.send('Подключение к базе данных выполнено успешно');
});
// Запуск сервера на порту 3000
app.listen(3000, () => {
console.log('Сервер запущен на порту 3000');
});
<audio id="audio1" src="music.mp3"></audio>
<audio id="audio2" src="music2.mp3"></audio>
const audioElements = Array.from(document.getElementsByTagName('audio'));
const stopOtherAudio = (currentAudio) => {
audioElements.forEach((audio) => {
if (audio !== currentAudio) {
audio.pause();
audio.currentTime = 0;
}
});
};
audioElements.forEach((audio) => {
audio.addEventListener('play', () => stopOtherAudio(audio));
});
class A {
constructor() {
if (!A.prototype.hasOwnProperty('obj')) {
A.prototype.obj = { 'b': 1, 'c': 2 };
}
}
}
class B extends A {
constructor() {
super();
this.nvmProp = 'zZzz';
}
changeObj() {
this.obj.b = 10;
}
}
class C extends A {
constructor() {
super();
this.nvmProp = 'zZzzZz';
}
changeObj() {
this.obj.c = 20;
}
}
let a = new A();
let b = new B();
let c = new C();
b.changeObj();
c.changeObj();
console.log(b.obj); // {b: 10, c: 20}
function orderedCount2(str) {
const symbols = new Map();
for (const c of str) {
const currCount = symbols.get(c) || 0;
symbols.set(c, currCount + 1);
}
const totalCount = str.length;
const orderedSymbols = {};
for (const [symbol, count] of symbols.entries()) {
orderedSymbols[symbol] = (count / totalCount) * 100;
}
return orderedSymbols;
}
input:
orderedCount("hello world")
output
{
h: 9.090909090909092,
e: 9.090909090909092,
l: 27.27272727272727,
o: 18.181818181818183,
' ': 9.090909090909092,
w: 9.090909090909092,
r: 9.090909090909092,
d: 9.090909090909092
}
matchMedia.addEventListener(function () {
initSpollers(spollersArray, matchMedia);
});
matchMedia.addEventListener('click', function() {
initSpollers(spollersArray, matchMedia);
});
BX.ajax.runComponentAction('componentName', "actionName", {
mode: 'ajax',
data: new FormData(form)
})
use \Bitrix\Main\Application;
$request = Application::getInstance()->getContext()->getRequest();
$files = $request->getFileList()->toArray();
const userName = nameInput.value;
const tel = telInput.value;
const text = textInput.value;
new FormData(form)