Google chrome causing infinite loop on textbox focus

Question

I'm getting some strange happenings on google chrome. With the following code I'm getting an infinite number of alerts.

<input type="text" />

$('input[type="text"]').live('focus', function(event) {
    alert('in');
});

http://jsfiddle.net/XppG9/

Firefox and IE8 are both fine.

Why is this happening in chrome?

kazinix · Accepted Answer · 2013-11-20T07:48:10.497

9

I think, it's because after you close the dialog (alert box), the focus returns on the textbox, therefore, the function will fire again.

edited Nov 20 '13 at 07:48

answered Jul 29 '11 at 06:29

kazinix

28,987
33
107
157

Hmm thanks for your answer. See here for my real issue http://stackoverflow.com/questions/6869717/google-chrome-infinite-loops-and-selecting-text – ajbeaven Jul 29 '11 at 07:05
For other's looking at this, if you're debugging, use `console.log` instead of showing an alert modal as this will get around issues I was having above. – ajbeaven Mar 25 '13 at 20:48

score 5 · Answer 2 · answered Jul 29 '11 at 06:27

5

I think it's because the the browser is sending focus from the alert to your text field every time you click the alert's "OK" button. You're probably not going to be popping up an alert (methinks) in the final version of your code, so this might not be an issue in the long run.

answered Jul 29 '11 at 06:27

Mark Carpenter

17,445
22
96
149

2

+1 also instead of an alert i often add an extra div on the page (sometimes positioned absolute) and just add messages into that div. eg `$("#myMessageDiv").append(messageString + "
");` – James Khoury Jul 29 '11 at 06:33
1

I do the exact same thing - less invasive than alerts while developing :) – Mark Carpenter Jul 29 '11 at 06:34
2

I prefer console.log, it can handle any types. – Wylie Jul 29 '11 at 06:36
1

@James - Yeah I personally cannot stand browser alerts at all, if I want to give the user a message I will do it in a nice way. – daryl Jul 29 '11 at 06:37
1

@Wylie yeah console.log is fine but then I have to have the console open and I'm lazy. – James Khoury Jul 29 '11 at 06:39
Hmm thanks for your answer. See here for my real issue http://stackoverflow.com/questions/6869717/google-chrome-infinite-loops-and-selecting-text – ajbeaven Jul 29 '11 at 07:05

score 2 · Answer 3 · answered Jul 29 '11 at 06:32

2

The problem is that the alert() is stealing focus from the input box, and then restoring it when the dialog is closed. You can fix this by clearing focus from the input box before you show the alert.

Example: http://jsfiddle.net/XppG9/6/

answered Jul 29 '11 at 06:32

aroth

54,026
20
135
176

I think this doesnt solve his problem, the user will get a prompt each time he focuses on the textbox, then he'll respond. The user will probably go to textbox again to type, a prompt will appear again. – kazinix Jul 29 '11 at 06:37
@domanokz - Correct, this just removes the infinite loop. It does nothing to remove the usability issues caused by popping up an alert whenever a field gains focus. – aroth Jul 29 '11 at 06:38

score 1 · Answer 4 · answered Jul 29 '11 at 06:33

1

This is happening because it is setting focus back to the text box. Try this it should work fine in Chrome

$('input[type="text"]').live('focus', function(event) {
    alert('in');
    $(this).blur();
});

answered Jul 29 '11 at 06:33

Kishore

1,914
1
15
22

score 0 · Answer 5 · answered Jul 29 '11 at 06:38

Because alert is getting the focus from your text box, and on closing the alert dialog,focus gets back. If you do any non focusing mechanism inside your function , it will trigger only once : http://jsfiddle.net/G8CmV/

<input type="text" />
<div id='tester'>Test:</div>



 $('input[type="text"]').live('focus', function(event) {
    $('#tester').html( $('#tester').html() + "_*" );
  });

Google chrome causing infinite loop on textbox focus

5 Answers5

Linked