Javascript 制作虹膜&x27；s颜色选择器在'；没有聚焦

我的HTML：

<input type="text" id='color-picker' value="#bada55" /><br />

我的朋友：

如果没有模糊/聚焦功能，如果单击文本输入，颜色选择器将出现并且永远不会消失。使用模糊/聚焦功能，如果你点击颜色选择器，它会出现，但如果你真的选择了一种颜色，它就会消失

如果附加的文本输入或html合成本身失去焦点，我希望颜色选择器消失。单击颜色选择器中的颜色不应使其消失。不幸的是，我不知道如何让它做到这一点。有什么想法吗？

jQuery（文档）.ready（函数（$）{
$（“#颜色选择器”）.iris（）；
$（“#颜色选择器”）.focus（函数（）{
$（“#颜色选择器”）.iris（'show'）；
$（'.iris-picker'）.addClass（'active'）；
});
$（文档）。在（'单击'）上，函数（事件）{
var clicked=$（event.target），
$iris=$（'.iris选择器'）；
if（$iris.hasClass（'active'）&&&！clicked.is（'.iris picker'）&&！clicked.is（'#color picker'））{
$（“#颜色选择器”）.iris（'hide'）；
$iris.removeClass（'active'）；
}
});
});



zzz
jQuery（文档）.ready（函数（$）{
$（“#颜色选择器”）.iris（）；
$（“#颜色选择器”）.focus（函数（）{
$（“#颜色选择器”）.iris（'show'）；
$（'.iris-picker'）.addClass（'active'）；
});
$（文档）。在（'单击'）上，函数（事件）{
var clicked=$（event.target），
$iris=$（'.iris选择器'）；
if（$iris.hasClass（'active'）&&&！clicked.is（'.iris picker'）&&！clicked.is（'#color picker'））{
$（“#颜色选择器”）.iris（'hide'）；
$iris.removeClass（'active'）；
}
});
});



zzz
您可以通过如下方式检查您是在颜色选择器内部还是外部单击：


jQuery（文档）.ready（函数（$）{
$（“#颜色选择器”）.iris（）；
$（“#颜色选择器”）.blur（函数（）{
setTimeout（函数（）{
if（！$（document.activeElement）.closest（“.iris picker”）.length）
$（“#颜色选择器”）.iris（'hide'）；
其他的
$（“#颜色选择器”）.focus（）；
}, 0);
});
$（“#颜色选择器”）.focus（函数（）{
$（“#颜色选择器”）.iris（'show'）；
});
});



zzz
您可以通过如下方式检查您是在颜色选择器内部还是外部单击：


jQuery（文档）.ready（函数（$）{
$（“#颜色选择器”）.iris（）；
$（“#颜色选择器”）.blur（函数（）{
setTimeout（函数（）{
if（！$（document.activeElement）.closest（“.iris picker”）.length）
$（“#颜色选择器”）.iris（'hide'）；
其他的
$（“#颜色选择器”）.focus（）；
}, 0);
});
$（“#颜色选择器”）.focus（函数（）{
$（“#颜色选择器”）.iris（'show'）；
});
});



zzz
你所说的
html自身组合是什么意思？@LuckySoni-用于创建颜色选择器的html。它从“检查此元素”的
div class=“iris-picker-iris-mozilla-iris-border”style=“display:block”
等开始。您所说的
html自身构成是什么意思？@LuckySoni-用于创建颜色选择器的html。它从“检查此元素”的
div class=“iris picker iris-mozilla iris-border”style=“display:block”
等开始。您可以使用模糊事件中的信息，而不是使用setTimeout更新activeElement:
$（e.originalEvent.explicitOriginalTarget）。最近（..
而不是使用setTimeout来更新activeElement，您可以使用模糊事件中的信息：
$（e.originalEvent.explicitOriginalTarget）.closest（..
jQuery(document).ready(function($){
    $('#color-picker').iris();
    $('#color-picker').blur(function() {
        $('#color-picker').iris('hide');
    });
    $('#color-picker').focus(function() {
        $('#color-picker').iris('show');
    });
});