Mesuti

По наличию какого класса будем опознавать элементы, которые должны быть подвергнуты суммированию; куда надо записывать сумму; и как эту сумму посчитать:

const className = 'select';
const sumEl = document.querySelector('.sum');
const sum = elements =>
  Array.prototype.reduce.call(
    elements,
    (acc, n) => acc + (+n.value || 0),
    0
  );

Делегирование, назначаем обработчик события change один раз:

const updateSum = () => sumEl.textContent = sum(document.getElementsByClassName(className));
document.addEventListener('change', e => e.target.classList.contains(className) && updateSum());
updateSum();

Или, назначаем обработчик каждому элементу индивидуально:

const selects = document.querySelectorAll(`.${className}`);
const updateSum = () => sumEl.innerText = sum(selects);
selects.forEach(n => n.addEventListener('change', updateSum));
updateSum();

как сохранить post запрос в *.txt файл.

file_put_contents('file.txt', json_encode($_POST), FILE_APPEND);

Какой php скрипт нужен что бы при нажатий на Отправить log и pass сохранились в txt файл?

Никакой. Просто берите нужные данные из $_POST. Но это будет очень большая уязвимость - хранить пароли в незахешированном виде.

И как назначить php скрипт в action? или нужно отдельно создать файл index.php?

<form action="execut.php">
...
</form>

fwrite($file, print_r($post, true));

Можно просто через цикл с обращением по индексам в обратном порядке.

for (let i = arrayWords.length-1; i >= 0; i--) {
  let n = arrayWords[i];
  //..............
}

Кстати, а почему вы в такой ситуации использовали map вместо forEach?

if([b, c, d, f].indexOf(a) >= 0 ){
 // .....
}

if ([b, c, d, f].includes(a)) {
    // .....
}

Привязанное событие "submit" не вызывается, если мы руками триггерим "form.submit()".

Как вариант решения - в каждую форму добавить скрытую кнопку, и чтобы стриггерить submit, тыкать эту кнопку вместо прямого вызова .submit()

У меня, честно говоря, нет ощущения, что это идеальное решение - костыль какой-то, но этот костыль определённо лучше того, что предлагает сам автор.

// Вариант 1. Привязываем контекст и первые по порядку параметры
function someFunk(a, b, event) {
	console.log(a, b, event);
}
element.addEventListener('click', someFunk.bind(null, 1, 2));

// Вариант 2. Используем интерфейс EventListener
function someFunk(event) {
	console.log(this.a, this.b, event);
}
element.addEventListener('click', {handleEvent: someFunk, a: 1, b: 2});

if(loginBtn) {
loginBtn.addEventListener('click', function() {
    alert('++');
});
}

Ну во-первых надо кнопку тоже в темплэйт засунуть, чтобы Vue о ней знал.
А во-вторых v-on:click="seen = !seen"
https://www.youtube.com/watch?v=037TFFtE-qo

У вас vue монтирован на app-3 и он не будет видеть все, что находится вне. Соответственно директива v-on:click на кнопке во втором примере не имеет смысла.

Это называется metabox. Добавляется функцией add_meta_box()

По умолчанию в php отключено, хотя так умеет.

Так что нет, никто не узнает откуда у вас ушло письмо.

Хотя вижу в хрустальном шаре что задача-проблема совсем другая.
Вероятно в

скрыт и секретный

Секретный скрипт который можно постучать из вне не такой уж секретный.
Особенно если называется mail.php.
ДЛя того чтобы всё-таки сделать его секретным нужно добавить хотя бы какой-то пароль на доступ к нему.
Т.е. /mail.php?secret=supersecretpassword
И тогда уже точно станет "секретным".

foreach ($json as $key => $value) {

Решил проблему таким способом :
В форму добавил поле

<input id="check" name="check" type="hidden" value="" />

Потом в кнопку, через которую идёт отправка, добавил

onclick="document.getElementById('check').value = 'secretcode';"

Вышло что-то вроде этого

<button onclick="document.getElementById('check').value = 'secretcode';" type="submit">Отправить</button>

И в php-обработчике, добавил это

if ($_POST['check'] != 'secretcode') exit('Spam decected');

Возможно кому-то поможет.
Удачи!

Да. /somedir/**/*.js - все джейэсы любой вложенности
/somedir/**/*.* - ваще все любые поддиректории с любыми файлами

Единая точка входа - один php файл, (обычно index.php лежащий в корне сайта), в который попадают все запросы ко всем страницам. Он запускает движок и вызывает router (маршрутизатор) - скрипт, который по url определяет какой раздел и какая страница запрошена. Ориентируясь на правила прописанные в маршрутизаторе он запускает нужный модуль (читайте про mvc). Там где-то происходят обращения в базу данных, какая-то бизнес-логика работает, и в итоге данные передаются в шаблонизатор, который выдает HTML код.

Чтобы самому не изобретать всё с нуля можно взять набор готовых компонентов. Такие наборы называются фреймворками.
Это все подходит не только для крупных сайтов, а для любых проектов, где больше одной страницы.

Свойство, содержащее выбранные элементы уже есть - отлично, используя его, можно сделать вычисляемое свойство, управляющее активностью кнопки:

computed: {
  disabled() {
    return !this.selected.length;
  },
},

<v-btn
  :disabled="disabled"
  ...