Problems with unbinding a function by handler
<p>I have html like this:</p>

<pre><code>&lt;div&gt;
    &lt;input type="checkbox" id="checkbox", checked="checked"/&gt;
    &lt;label for="checkbox"&gt;Copy values&lt;/label&gt;
&lt;/div&gt;
&lt;div&gt;
    &lt;input id="source" type="text"/&gt;
&lt;/div&gt;
&lt;div&gt;    
    &lt;input id="target" type="text"/&gt;
&lt;/div&gt;
</code></pre>

<p>And I'm trying to implement jQuery code to copy value from <code>source</code> input to <code>target</code> one, only when the checkbox is checked. Here's my code:</p>

<pre><code>var checkbox = $("#checkbox");
var source = $("#source");
var target = $("#target");

var bindFunction = function () {
    var copyValue = function () {console.log("asd");
        target.val(source.val());
    }
    if (checkbox.is(":checked")) {
        source.bind("keyup", copyValue);
    }
    else {
        source.unbind("keyup", copyValue);
    }    
}
checkbox.bind("change", bindFunction);
bindFunction();
</code></pre>

<p>However, it does not work as expected - for some reason the <code>copyValue</code> function doesn't get unbound. What am I doing wrong?</p>

<p>Here's a <a href="http://jsfiddle.net/5b93H/" rel="nofollow">jsFiddle</a>.</p>
