Нажатие кнопки работает нормально, но нежелательное поведение при нажатии Enter для отправки формы - PullRequest
0 голосов
/ 28 июля 2011

Я не уверен, нужна ли мне форма для этого, это javascript, который принимает входные данные из текстового поля, выполняет некоторые вычисления и отображает результаты в div.Я просто хочу, чтобы пользователь мог отправить сообщение, нажав «Отправить» или нажав «Ввод».

Короче говоря, если тип кнопки "кнопка", нажатие работает нормально, но нажатие клавиши ввода работает странно, а если тип кнопки "отправить", нажатие клавиши ввода работает нормально, но нажатие работает странно.Ниже приведен пример кода (удалены некоторые бизнес-логики и другие переменные, которые работали нормально, чтобы его было проще отображать здесь):

<form action="#" onsubmit="calcserial()">
Serial no: <input type="text" name="serialno" id="serialno" /><br />
<input type="button" value="Submit" onclick="calcserial()" />
</form>

<script type="text/javascript">
function calcserial(){  

var x=document.getElementById('serialno').value;

var year=[business logic];
var month=[business logic];

document.getElementById('results').innerHTML="Shipped: " + month + ", " + year;  
} 
</script>

<div id=results></div>

Чтобы дать более подробную информацию о странном поведении, когда тип ввода«Кнопка», и я нажимаю ввод, вместо запуска функции calcserial (), текстовое поле очищается, а URL-адрес изменяется на:

[filename].php?serialno=[value]#

. Значение [value] соответствует тому, что когда-либо было в текстовом поле.Затем, если я снова введу то же самое точное значение и снова нажму enter, он будет работать как положено, но только если в URL уже указано значение, которое я отправляю.Если я введу другое значение, текстовое поле снова очищается, а URL-адрес изменяется, чтобы показать новое значение.Если я переключаю тип ввода на «отправить», проблема решается нажатием клавиши ввода, но при нажатии кнопки для отправки возникает такая же проблема.

Почему это происходит?Есть идеи как это решить?Спасибо!

1 Ответ

1 голос
/ 28 июля 2011

Попробуйте изменить это:

<form action="#" onsubmit="calcserial()">

К этому:

<form action="#" onsubmit="calcserial();return false;">

Это должно остановить действие по умолчанию, которое обычно происходит при отправке формы, что в вашем случае с action="#" приводит к перезагрузке той же страницы.

Учитывая, что вы на самом деле ничего не хотите отправлять (веб-серверу), вам не нужна форма для этого. <input type="button"> плюс проверка ввода onkeyup ввода текста может дать тот же эффект.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...