title: Knockout binding on focusout for a div containing a form
body: <p>I'm trying to achieve a kind of what is done in the simple example 1 in ko documentation <a href="http://knockoutjs.com/documentation/hasfocus-binding.html" rel="nofollow">for the has focus binding</a> but applied to a div containing a form, and just in one direction would be fine</p>
  
  <p>Using focusout in the code below I face the problem that once focusOnDiv is set to true, if I change from one input to another the event is triggered and the is coming back to false. I was expecting not to be triggered as it's inside the div. I can use focusin in the same event binding to set it to true as in the fiddle but I doubt whether this solution is acceptable</p>
  
  <p>Html:</p>
  
  <pre><code>&lt;div tabindex ="-1" class="parentdiv" data-bind="event: { focusout: resetFocusOnDiv}"&gt;
       &lt;p&gt;&lt;div&gt;Just a div&lt;/div&gt;&lt;/p&gt;
       &lt;p&gt;&lt;span&gt;And a span&lt;/span&gt;&lt;/p&gt;
       &lt;p&gt;&lt;select&gt;
           &lt;option&gt;First&lt;/option&gt;
           &lt;option&gt;Second&lt;/option&gt;
           &lt;/select&gt;
       &lt;/p&gt;
       &lt;input type="checkbox"&gt;Checkbox&lt;/input&gt;
      &lt;p&gt;&lt;input data-bind="value: firstValue" /&gt;&lt;/p&gt;
      &lt;p&gt;&lt;input data-bind="value: secondValue" /&gt;&lt;/p&gt;
  &lt;/div&gt;
  &lt;div data-bind="text: focusOnDiv"&gt;&lt;/div&gt;
  &lt;input type="button" data-bind="click: setFocusOnDiv" value="Click"&gt;
  </code></pre>
  
  <p>Js:</p>
  
  <pre><code>var viewModel = function() {
      var self= this;
  
      self.firstValue = ko.observable('a');
      self.secondValue = ko.observable('b');
  
      self.focusOnDiv = ko.observable(false);
  
      self.setFocusOnDiv = function(){
          self.focusOnDiv(true);
      };
  
      self.resetFocusOnDiv = function(){
          self.focusOnDiv(false);
      };
  };
  
  
  ko.applyBindings(new viewModel());
  </code></pre>
  
  <p>Fiddle <a href="http://jsfiddle.net/Qyn9b/" rel="nofollow">here</a></p>