-1

I made a div, when you press "e", it places a text box over the text. When you press tab, it takes the contents and places them into the div.

However, after this happens, it no longer recognizes key events until you click in the window again (I'm 90% certain it goes to the address bar -- at least that's what it does for me now in the jsfiddle link below -- but have tried so many things at this point that I have conflicting experiences).

http://jsfiddle.net/gt05Lwx4/

StackOverflow won't let me link to jsfiddle without having a code block (wtf?)
Anders
  • 8,307
  • 9
  • 56
  • 88
Joshua Cheek
  • 30,436
  • 16
  • 74
  • 83
  • I can't replicate what you're reporting. After the blur I can continue typing or press 'e' to edit the text box again. – JSuar Oct 27 '14 at 02:40
  • 1
    Instead of the complaint, you could have put your code in that code block! – techfoobar Oct 27 '14 at 02:41
  • Hmm, I just tried in Opera 25, Chrome 38, and Safari 7. In Safari, it jumps to the address bar. I realized it does this in the others, too (I have a plugin, vimium, that I had turned off for jsfiddle, but it didn't take b/c jsfiddle runs it in an iframe on a different domain). I'll update the question to reflect this. – Joshua Cheek Oct 27 '14 at 02:46
  • @techfoobar then I edit it, and it's no longer in sync with the link, or I edit the link, and its no longer in sync with the code here. It's an absurd rule, imposed for no obvious reason other than content envy. – Joshua Cheek Oct 27 '14 at 02:49
  • @JoshuaCheek - Ok. But sometimes, it helps to suggest an answer without having to go to another link (which incidentally can be broken as well)! By the way, check my answer. – techfoobar Oct 27 '14 at 02:52
  • Thank you for the answer! Still going to disagree with you about SO forcing me to include code, though. It's incredibly coercive. Besides, what if I'd posted it on some other site? Or They wouldn't even know to try and do this. And really, if they're going to be heavy handed, then they need to provide a compelling explanation. – Joshua Cheek Oct 27 '14 at 02:58
  • 1
    @JoshuaCheek - There have been cases where people simply linked to their sites saying there's some problem they can't figure out - without explaining anything specific about the problem. Such questions take too much effort to answer, as well as won't be of much use to future visitors. Forcing a code block does help in making the question more to the point. But, yeah that's just my POV. And btw, there's always http://meta.stackoverflow.com/ in case you would like to bring this up for a discussion with the whole community. – techfoobar Oct 27 '14 at 03:06

1 Answers1

1

One way of working around this is making your #container focusable with a tabindex value that is greater than that of the temporary textbox. And then letting the browsers's default action do its thing with the tabindices (default behaviour is shifting focus to the element with the next higher tabindex).

Demo: http://jsfiddle.net/gt05Lwx4/2/

Code:

<div id="container" tabindex="2"></div>

And when you add the textbox, do:

var textBox = $('<input type="text" tabindex="1" name="name"></input>')
...
techfoobar
  • 65,616
  • 14
  • 114
  • 135