如何在模糊时销毁 Jquery UI 微调器

Question

大家好，我有文本框，我希望它们在聚焦时成为微调器，在模糊时成为文本框这是我的代码

$(".spinner").focus(function () {
    $(this).spinner();
});

$(".spinner").blur(function () {
    $(this).spinner("destroy");
});

演示 http://jsfiddle.net/ygyogba0/

但我收到错误 "Cannot read property 'replaceWith' of undefined"

谁能帮我解决这个问题？

提前致谢

Answer 1

这在 chrome 和 IE11 中对我有用。似乎微调器小部件在创建后没有设置焦点。使用 "On" 是一种很好的做法，尤其是如果您开始进行部分回发。但是，在 Firefox 中，即使有额外的调用，它也没有设置焦点。这是一个在论坛中详细讨论的问题。如果你需要 FF，你将不得不处理它。

但是，如果用户从不点击微调器，FF 问题只是一个问题。我不确定此解决方案是否已准备好投入生产。

$("body").on("focus", ".spinner", function () {
$(this).spinner({
    create: function (event, ui) {
        $(this).focus();
        // Trying (and failing) to deal with FF
        /*setTimeout(function () {
            $(this).focus()
        }, 10); */
    }
});

});

$("body").on("blur", ".spinner", function () {
$(this).spinner("destroy");
});

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet" />

<input type="text" class="spinner" /><br>
<input type="text" class="spinner" /><br>
<input type="text" class="spinner" /><br>
<input type="text" class="spinner" /><br>

如何在模糊时销毁 Jquery UI 微调器

How to destroy Jquery UI spinner on blur

jquery-ui

jquery-ui-spinner