0

我正在使用 jQuery 1.7.1 和 jQueryUI 1.9.1。

我有一个微调器，每次更改时，都会创建或删除一个文本字段以匹配微调器上的数字。按住按钮将导致数字快速变化，从而导致创建或删除大量字段。

不是一个大问题，因为它是客户端，但我只是不喜欢它。所以我想在用户按住微调按钮时禁用快速旋转。

我想出了一个使用增量函数的解决方案，如下所示：

var incrementalFunction = function(numOfSpins) {
    if (numOfSpins == 1) {
        return 1;
    }
    return 0;
};

这起初效果很好，但引起了另一个问题。在每个新创建的文本框旁边，我制作了一个“删除”按钮，可以删除元素并减少微调器。但是当我调用该stepDown方法时，由于某种原因，这会调用我的增量函数，numOfSpins每次调用时都会增加。所以它只会减少一次。

任何人都有更直接的解决方案来防止用户按住递增/递减按钮（或键盘上的向上/向下箭头）？

4

2 回答 2

1

如果您使用stop事件，而不是针对每个增量，您可以检测何时进行了选择。然后，您可以将该数字与当前存在的数量进行比较，并确定要做什么 - 删除或添加更多。尝试这个：

var targetArea = $("#target_area");

targetArea.on("click", ".remover", function () {
    $(this).closest("div").remove();
    $("#input1").spinner("stepDown");
});

$("#input1").spinner({
    stop: function (event, ui) {
        var $this = $(this);
        var num = $this.val();

        var newTargets = targetArea.find("div");
        var difference = num - newTargets.length;
        if (difference < 0) {
            newTargets.slice(difference).remove();
        } else if (difference > 0) {
            for (var i = 0; i < difference; i++) {
                var newTarget = $("<div><input type='text' /><span class='remover' title='Remove'>&times;</span></div>");
                targetArea.append(newTarget);
            }
        }
    }
});

演示：http: //jsfiddle.net/PJpUC/1/

于 2013-05-10T17:54:10.673 回答
1

如果升级到 jQuery UI 1.10，问题就会消失。请参阅https://github.com/jquery/jquery-ui/commit/0d53fbfd0b7651652601b3b8577225ab753aab44，这会导致stepUp()并stepdDown()按照您的预期行事。

于 2013-05-10T18:00:15.093 回答