title: Focus on an anchor tag
body: <p>I have some HTML that looks something like this:</p>
  
  <pre><code>            &lt;div id="zoomed" style="display:none; position:absolute;"&gt;
              &lt;a href="#" alt="close" id="closeLink" onclick="closeZoom();" tabindex="2"&gt;&lt;img alt="close" style="border-style:none" class="close" id="closeButton" src="Images/trans.png"/&gt;&lt;/a&gt;
              &lt;div class="zoomParent"&gt;
              &lt;table&gt;
                  &lt;tbody data-bind="with: currentFactor"&gt;
                      &lt;tr&gt;&lt;td class="zIngHeader" colspan="3"&gt;
                      &lt;span data-bind="text: FactorName"&gt;&lt;/span&gt;
                      &lt;/td&gt;
                      &lt;/tr&gt;
                      &lt;tr&gt;
                          &lt;td class="zMin" data-bind="text: formatValues(Min)"&gt;&lt;/td&gt;
                          &lt;td&gt;&lt;input type="text" data-bind="value: currentValue" class="channel" onkeydown="EnterToTabHack(event);" tabindex="1"/&gt;&lt;/td&gt;
                          &lt;td class="zMax" data-bind="text: formatValues(Max)"&gt;&lt;/td&gt;
                      &lt;/tr&gt;
                      &lt;tr&gt;&lt;td colspan="3" class="graphCell" data-bind="animateColor: $root.statusColor"&gt;&lt;div id="zoomPlot" class="zoomPlotStyle"&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
                  &lt;/tbody&gt;
              &lt;/table&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Now, when you are in the text box and you hit the tab key, the anchor tags gets focus, so if you immediately hit enter, you'll run the function closeZoom(). This works fine.</p>
  
  <p>What I want to do is have so if you are in the textbox and you hit enter, it will behave the same way as if you hit tab. So I have a function to do this:</p>
  
  <pre><code>    function EnterToTabHack(event) {
          if ((event.which &amp;&amp; event.which == 13) || (event.keyCode &amp;&amp; event.keyCode == 13)) {
              $(".channel").blur();
              $("#closeLink").focus();
          }
      }
  </code></pre>
  
  <p>The blur part works fine, the value in the textbox gets written back to my viewmodel as I wanted, but the focus doesn't end up on my link. Hitting enter twice <em>should</em> accept the value in the textbox (which is does) and then close the window (it doesn't).</p>
  
  <p>Any idea what might be wrong here? I see no error messages, but clearly the focus isn't on the anchor link like it would be if I hit tab (note: just blurring doesn't seem to do it either).</p>
  
  <p><strong>Edit:</strong> I've added a little more of the html because it may, or may not, be relevant. In particular, I'm using KnockoutJS for data binding and I think that is making it impossible to use the type of jQuery bindings (of events) that several people have suggested, or at least, if I were to use them, I'd have to rebind then every time "currentFactor" changed because <em>I think</em> what knockout is doing is destroying everything in the body of the table and recreating it when that part changes.</p>
  
  <p><strong>Another Edit:</strong> First, a really big thanks to everybody who has tried to help so far! I really appreciate you taking the time to take a look at this.</p>
  
  <p>I played around and put together a JS Fiddle:</p>
  
  <p><a href="http://jsfiddle.net/sUh8G/4/" rel="nofollow">http://jsfiddle.net/sUh8G/4/</a></p>
  
  <p>At first I was confused because, of course, it worked fine! Then I added the styles for the img and it seems that using sprites this way is what breaks it. If you remove all the img styles from the css, it works fine. With them, I can't focus it programmatically.</p>
  
  <p>Anybody seen anything like that before?</p>