Отправить работает только один раз

Вот моя простая форма HTML & JS:Отправить работает только один раз

<body> 
    <form> 
     <label for="usrtext">Enter text here:</label> 
     <br /> 
     <textarea name="usrtext" id="usrtext" rows="25" cols="100"></textarea> 
     <br /> 
     <button id="btn" type="button">Send</button>  
    </form> 
    <script type="text/javascript"> 
     document.getElementById('btn').onclick = request; 

     function request() 
     { 
      var xhr = new XMLHttpRequest(); 

      var usrtext = document.getElementById("usrtext").value; 

      xhr.open("GET", "sampleb.php?usrtext="+usrtext, true); 

      xhr.onreadystatechange = function(aEvt) 
      { 
       if (xhr.readyState == 4) 
       { 
        if (xhr.status == 200) 
        { 
         var temptxt = document.body.innerHTML; 
         document.body.innerHTML = temptxt + xhr.responseText; 
        } 
       } 
      } 

      xhr.send(''); 
     } 
    </script> 
</body>

Вот страница PHP (sampleb.php):

<?php 

if (isset($_REQUEST["usrtext"])) 
{ 
    $output = $_REQUEST["usrtext"]; 
} 

echo $output; 
?>

Проблема у меня есть что, когда вы вводите текст в текстовое поле и отправляете его, php-страница получает текст и возвращает его обратно. НО это работает только в первый раз. Если я введу новый текст в текстовое поле и нажмите кнопку отправки, вызов ajax не работает во второй раз.

Я довольно новичок в этом, но я заменил «запрос» на console.log, и если я нажму кнопку несколько раз, он регистрируется в Firebug. Я также заменил «запрос» на функцию «annon», которая вызывает окно предупреждения и работает при нескольких нажатиях кнопок ... Я просто не знаю, почему моя функция «request()» не вызывается второй раз.

источник

2011-01-07 Brownbay

Вы заменяете весь корпус документа в обратном порядке ajax. Это означает, что зарегистрированное событие клика также потеряно. Вы должны снова зарегистрировать событие.

Когда вы

var temptxt = document.body.innerHTML; 
document.body.innerHTML = temptxt + xhr.responseText;

Он заменяет все тело документа с новым DOM дерева, которое будет вызывать скрипт и и форма дом должен быть заменен на новый йот дерева.

Собственно, что вы хотите сделать в конце запроса ajax. Я не понимаю, почему вам нужно заменить весь документ.

источник

2011-01-07 06:23:43

Ahh, я понимаю сейчас. Итак, просто для подтверждения, когда новое дерево DOM создается без новой загрузки страницы, браузер не будет повторно выполнять HTML и JS еще раз? – Brownbay

Нет, вы удаляете существующий html и скрипт и заменяете их новым контентом. Каково ваше фактическое требование? В обычных случаях мы не будем заменять весь документ 'document.body.innerHTML', вместо этого мы заменяем только часть« документа ». Пример: содержимое внутри определенного 'div' на странице –

Отправить работает только один раз

ответ

Смежные вопросы