1

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

我的问题是，当您只关注（单击）第一个字段，然后关注第二个（反之亦然）时，按钮单击会打印到两者，而不仅仅是（最后一个）关注的字段。

您可以尝试在这里重现问题：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>
4

3 回答 3

2

在“focus”处理程序中，取消绑定任何现有的“click”处理程序：

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

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

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

于 2012-09-01T16:49:33.667 回答
1

把变量 iD 放在外面，把函数分开：

http://jsfiddle.net/sQd8t/8/

这可以防止在每个输入单击/焦点上添加太多事件。无需解绑。

var iD;
$('.family').focus(function() {
    iD = $(this).attr('id');
});

$("#sets").on('click', function() {
    var ra = Math.floor((Math.random() * 10) + 1);
    if (iD!="")$('#' + iD).val(ra);
    iD = "";
});
于 2012-09-01T16:57:49.537 回答
1

见http://jsfiddle.net/sQd8t/11/

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

    $("#sets").attr('data-target',$(this).attr('id'))

});

$("#sets").click(function() {

    var target=$(this).attr('data-target');

    if(target){

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

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

    }

});

您可以创建一个data-target包含必须修改的字段的属性。

于 2012-09-01T17:00:41.700 回答