событие нажатия кнопки, потерянное из-за окна предупреждений в текстовом поле onblur событие
Я создал простую веб-форму, содержа одно текстовое поле и одну кнопку. Я получил onblur событие текстового поля.
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
function onTextBoxBlur()
{
alert("On blur");
return true;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:TextBox ID="TextBox1" runat="server" onblur="onTextBoxBlur();"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
</form>
</body>
</html>
Когда я ввожу некоторое значение в текстовое поле и нажимаю на кнопку, затем onblur событие текстового поля имеет место, но onclick кнопки не делает. И, когда я удаляю окно предупреждений из функции js затем, это хорошо работает. Некоторые, как нажатие кнопки является событием, потеряны. Я думаю, что это происходит из-за окна предупреждений. Какая-либо идея, почему это так?
3 ответа
Щелчок" кнопки состоит из двух частей: "вниз" и "вверх". Когда вы нажимаете кнопку вниз, она получает фокус, размывая текстовое поле и запуская ваше оповещение. Поскольку диалоги оповещения являются модальными, они останавливают всю активность на странице, поэтому кнопка не обнаруживает движения мыши вверх и ваш щелчок не завершается.
Можно обойти проблему, используя таймер в событии размытия и отменяя этот таймер в событии mousedown кнопки:
var timer;
function onTextBoxBlur()
{
timer = window.setTimeout(function () { alert("On blur"); }, 0);
return true;
}
function onButtonMouseDown()
{
clearTimeout(timer);
}
Понятно .... У меня все заработало ...
Добавление явного вызова к нажатию кнопки в событии onblur неверно, потому что событие onblur может произойти в любое время, например, когда пользователь переместится в другое текстовое поле или щелкните в любом месте формы и т. д. (как указано Кори Огберном в комментариях выше). Таким образом, нажатие кнопки будет запущено, хотя пользователь на самом деле не нажал кнопку.
Таким образом, в событии onblur должен быть способ определить, что отправка была нажата, и если это так, то явно активировать нажатие кнопки.Вот код
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
var clicked = 0;
function onTextBoxBlur()
{
alert("On blur " + clicked);
if(1 == clicked)
{
clicked = 0;
document.getElementById("Button1").click();
}
return true;
}
function SubmitButtonClicked()
{
clicked = 1;
}
</script>
</head>
<body>
<form id="form1" runat="server" >
<div>
</div>
<asp:TextBox ID="TextBox1" runat="server" onfocusout="onTextBoxBlur();"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" onmousedown="SubmitButtonClicked();" />
</form>
</body>
</html>
Здесь, при событии mousedown кнопки, которое происходит перед onblur текстового поля, я установил значение флага нажато и onblur of текстовое поле, теперь я могу определить, нажата кнопка или нет.
Но , опять же, это просто обходной путь и подходит для такого примера приложения :). Это менее осуществимо на практике, потому что в веб-форме может быть больше таких кнопок отправки, и нам придется активировать событие щелчка для всех таких кнопок (ссылок и т. Д.) В событии onblur текстового поля. Это связано с тем, что пользователь может нажать любую из кнопок отправки (ссылки и т. Д.) После ввода данных в текстовое поле, а предупреждение / подтверждение в onblur будет подавлять эти события щелчка. Надеюсь, я ясен.
Наслаждайтесь !!!
Напишите функцию и дайте вызов функции от событий mousedown и onClick кнопки