Почему не срабатывает before send?

Question

[Max Ba]

<input type="button" id="start" value="Отправить">

var btn = document.getElementById('start');

btn.addEventListener('click', function(){
  btn.value = "start"; //проблема тут
  
  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'test.php', false);
  xhr.onload = function(e){
    if(xhr.readyState == 4 && xhr.status == 200){
      btn.value = "ready";
    }
  };
  xhr.send();
});

//test.php

sleep(1);
echo time();

Answer 1

[Валентин В.]

код синхронный, обновлений в интерфейсе видно не будет;

скорее всего вам нужно открывать асинхронный запрос
xhr.open('POST', 'test.php', true);

или разделять код на несколько вызовов функций (что маловероятно)
с помощью, например, промисов или setTimeout(function(){...}, 0)

Comments

[Max Ba]

Да, поменяв на true всё заработало.
Спасибо. И спасибо Stalker_RED.

Answer 2

[Stalker_RED]

before send не срабатывает потому, что его в этом коде вообще нет.

Comments

[Max Ba]

Да это понятно)
Не соысем верно задал вопрос.
Проблема в коде выделена.

[Stalker_RED]

Max Ba,
1. видно "start", потом ошибка т.к. адрес неправильный
https://jsfiddle.net/L7exkgts/
2. в логе видно оба, хотя визуально незаметно. браузер не успевает отрисовать, т.к. вызов синхронный
https://jsfiddle.net/L7exkgts/1/
3. c асинхронным работает так, как вы хотели?
https://jsfiddle.net/L7exkgts/2/