Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.02.2013, 15:37
Новичок на форуме
Отправить личное сообщение для rebeled Посмотреть профиль Найти все сообщения от rebeled
 
Регистрация: 06.02.2013
Сообщений: 7

Срабатывает нажатие на button при нажатии Enter внутри input
<html><head>
        </head>
        <body>
            <form>
                <button value="OK" onclick="alert('Нажата кнопка');">ОК</button>
                <input>
            </form>
        
</body></html>

Не могу понять, почему, когда я жму на Enter после ввода текста в input срабатывает нажатие на кнопку ОК. Если кнопок много, срабатывает верхняя.

Словил alert в Firefox 18.0.2 и Chrome 24.0.1312.57 m
В IE 9.0.8112.16421 кнопка не жмётся.
Вложения:
Тип файла: zip test.zip (272 байт, 2 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 06.02.2013, 16:03
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Точно объяснить не могу, но это связано с тем что тип кнопки, если не указать, равен submit (тоесть имеем <button type=submit>)
А по Enter происходит как раз таки отправка формы. Ну и видимо так задумано что при этом срабатывает событие click по сабмитящей кнопке.
Кстати, если нажать Enter когда фокус находится на кнопке, также произойдет событие click, хотя мы даже мышку в руках в это время не держим. Оффтоп: пока писал, села батарейка в мышке, так что придется триггерить событие click нажатием Enter в ближайшее время ))
Ответить с цитированием
  #3 (permalink)  
Старый 06.02.2013, 16:33
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

<!DOCTYPE>
<html>
<head>
<script type="text/javascript">
function FFanaliz(a){
  //if(Тут анализ на отправку формы/типо: Все поля заполнены?/ ) return true;

  return false;
}
</script>
</head>
<body>
            <form onsubmit="return FFanaliz(this)">
                <button type="button" value="OK" onclick="alert('Нажата кнопка');">ОК</button>
                <input>
            </form>
        
</body>
</html>

Последний раз редактировалось Deff, 06.02.2013 в 16:49.
Ответить с цитированием
  #4 (permalink)  
Старый 06.02.2013, 17:08
Новичок на форуме
Отправить личное сообщение для rebeled Посмотреть профиль Найти все сообщения от rebeled
 
Регистрация: 06.02.2013
Сообщений: 7

Плохое решение для меня. Есть необязательные поля, состав полей в форме может менятся.
К тому же, если кнопка будет submit типа, она всё равно нажмётся
Ответить с цитированием
  #5 (permalink)  
Старый 06.02.2013, 17:57
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от rebeled
К тому же, если кнопка будет submit типа, она всё равно нажмётся

Сообщение от rebeled
Плохое решение для меня. Есть необязательные поля, состав полей в форме может менятся.
Но по какому-то событию Вы форму отправляете ?
Если нет - просто удалите строку
//if(Тут анализ на отправку формы/типо: Все поля заполнены?/ ) return true;

Последний раз редактировалось Deff, 06.02.2013 в 18:00.
Ответить с цитированием
  #6 (permalink)  
Старый 06.02.2013, 18:36
Новичок на форуме
Отправить личное сообщение для rebeled Посмотреть профиль Найти все сообщения от rebeled
 
Регистрация: 06.02.2013
Сообщений: 7

Сообщение от Deff Посмотреть сообщение
<!DOCTYPE>
	<html>
	<head>
	<script type="text/javascript">
	function FFanaliz(a){

	  return false;
	}
	</script>
	</head>
	<body>
	            <form onsubmit="return FFanaliz(this)">
	                <button value="OK" onclick="alert('Нажата кнопка');">ОК</button>
	                <input>
	            </form>
	         
	</body>
	</html>

При нажатии на Ентер выводится alert. По крайней мере в мозиле.

<!DOCTYPE>
	<html>
	<head>
	<script type="text/javascript">
	function FFanaliz(a){

	  return true;
	}
	</script>
	</head>
	<body>
	            <form onsubmit="return FFanaliz(this)">
	                <button value="OK" onclick="alert('Нажата кнопка');">ОК</button>
	                <input>
	            </form>
	         
	</body>
	</html>

Тоже самое

Проект написан на JSF, сабмиты в явном виде не вызываются. Всё обробатывается на уровне компонент, для правильной работы которой нужна форма. Как правило все запросы к серверу ajax. Плюс используются facelets. Т.е. в одной форме может быть совершенно разное содержимое. Даже если бы оно работло, обработать все варианты по onsubmit не представляется реальным.

Последний раз редактировалось rebeled, 06.02.2013 в 18:41.
Ответить с цитированием
  #7 (permalink)  
Старый 06.02.2013, 20:18
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Еще раз: по Enter происходит отправка формы. И это прекрасно.
Если у вас срабатывают кнопки, которые по идее не должны ничего сабмитить, так не делайте их сабмиттерами (type="button"). Если же это сабмиттеры, но вам нужно реагировать на клик по ним, думаю отличить клик мыши от программного несложно.
Ответить с цитированием
  #8 (permalink)  
Старый 06.02.2013, 20:19
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Помоему это и есть схема отправки формы по Enter: вызывается событие click на сабмитящей кнопке )
Ответить с цитированием
  #9 (permalink)  
Старый 06.02.2013, 20:38
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

<!DOCTYPE>
<html>
<head>

</head>
<body>
            <form onsubmit="return false">
                <input type="button" value="OK" onclick="alert('Нажата кнопка')"/>
                <input>
            </form>
        
</body>
</html>

Последний раз редактировалось Deff, 06.02.2013 в 21:22.
Ответить с цитированием
  #10 (permalink)  
Старый 06.02.2013, 20:49
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Да все проще можно сделать. Только не пойму зачем. Зачем может понадобиться обработка клика кнопки-сабмиттера, но при этом этот обработчик не подходит для программного клика. Какая разница то?
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
смена картинок при нажатии sdff Общие вопросы Javascript 15 08.02.2014 17:08
onClick на button при нажатии Enter atech Events/DOM/Window 2 09.08.2012 16:48
Событие onClick при нажатии пункта меню Lex4e Общие вопросы Javascript 1 25.06.2010 18:31
Смена картинки (бекграунд дива ) при событии (нажатие клавиш или клавиши и мыши) Monster Events/DOM/Window 5 01.11.2009 01:16
Выполнение скрипта при нажатии Entet в текстовм поле Vlasssov Общие вопросы Javascript 4 23.08.2009 23:31