Javascript формы Значение исчезают

Первый код:Javascript формы Значение исчезают

<html> 
    <head></head> 
    <body> 
    <script> 
     function calc_form(first, second) { 
      x = document.getElementById("calc"); 
      first = document.forms["calc"].elements["first"].value; 
      second = document.forms["calc"].elements["second"].value; 
      third = first*second; 
      document.forms["calc"].elements["result"].value = third; 
      document.getElementById("result1").innerHTML = third; 
     } 
    </script> 
<form name = "calc"> 
    <input type = "text" name="first"> 
    <input type="text" name="second"> 
    <input type="submit" onclick = "calc_form()"><br> 
    <input type="text" id="result"> 
</form> 
<p id="result1"></p> 
</body> 
</html>

Я знаю, что это бесполезно и очень бедных код, но я хочу знать, что почему значения, которые я ввожу в поле ввода исчезают сразу после ввода нажмите кнопку «Отправить».

Аналогичным образом результат в третьем поле ввода появляется только на мгновение, а затем исчезает. Почему это происходит?

источник

2015-01-31 saadi123

Они исчезают, потому что форма была отправлена, и страница перезагружается – adeneo

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

Изменить тип = "отправить" на тип = "кнопка" –

При нажатии на кнопку отправки html значения формы собираются и генерируется запрос сервера. В зависимости от типа запроса (POST или GET) данные отправляются на сервер в формате URL или форме. После запроса страница обновляется, поскольку код html клиента снова отображается.

Вы можете построить логику, считывая значения после получения ответа на серверный ответ клиенту. Тем не менее, я думаю, вам нужно в вашем коде, чтобы предотвратить отправку данных на серверную сторону каждый раз, когда вы нажимаете на кнопку, и делать расчеты только на клиенте. Вы можете сделать это двумя способами:

изменить тип кнопки «отправить» на «кнопку».
в событии oncick, а также в конце функции «return false». Он предотвращает действие отправки и отправляет запрос отправки на сервер.

< тип входного = "отправить" OnClick = "возвращение calc_form()" >

затем:

function calc_form(first, second) { 
     ... 
     return false; 
     ... 
    }

источник

2015-01-31 10:06:14 sna19

Код работает нормально даже без возврата false; Спасибо за объяснение. – saadi123

Javascript формы Значение исчезают

ответ

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