javascript - JQuery 专注于先前点击的输入错误

Question

我有两个输入字段。主要思想是，每当您关注其中一个字段时，单击按钮应该在其中打印一个随机数。

我的问题是，当您只关注(点击)第一个字段，然后关注第二个(反之亦然)时，按钮点击打印到两个而不是只打印到(最后一个)关注的字段。

You can try to recreate the problem here: http://jsfiddle.net/sQd8t/3/

JS:

$('.family').focus(function(){

var iD = $(this).attr('id');

    $("#sets").one('click',function() {

        var ra = Math.floor((Math.random()*10)+1);

        $('#'+iD).val(ra);


    });

});

HTML:

<center class='mid'>
    <input type="text" class="family" id="father" />
    <br/><br>
    <input type="text" class="family" id="mother" />

    <br/>
    <br/>
    <input type='submit' value='Set text' id="sets"/>
</center>

Answer 1

在“焦点”处理程序中，取消绑定(bind)任何现有的“点击”处理程序:

$('#sets').unbind('click').one('click', function() { ... });

按照您的方式，每次字段获得焦点时都会绑定(bind)一个额外的一次性“点击”处理程序，因为 jQuery 允许您将任意数量的处理程序绑定(bind)到一个事件。换句话说，调用 .one() 不会解除绑定(bind)其他处理程序。当点击实际发生时，所有处理程序都会运行。

编辑 — 抱歉 — “解除绑定(bind)”是旧的 API；现在 .off() 是首选。