鼠标、按键或完成后，从wpColorPicker (虹膜)获取颜色
鼠标、按键或完成后，从wpColorPicker (虹膜)获取颜色
提问于 2016-11-19 09:50:54
在ColorPicker (wpColorPicker或IrisColorPicker)上用户完成拖动后，我想更改SVG形状的填充颜色，因为有十几个SVG形状，每个形状都有很多圆圈、路径等.
因此，我试图在AutomatticIris中找到类似的事件，或者类似的事件，但是我失败了，只有艾里斯博士是可用的，但是由于我使用AJAX从服务器获得SVG形状，所以在change事件中不可能完成这个工作。
回答 1
Stack Overflow用户
回答已采纳
发布于 2016-11-19 11:34:43
这类问题的一个常见解决方案是每次发生更改事件时清除并启动一个定时器(通过setTimeout)。因此，只有在更改事件在一定时间内(setTimeout设置的间隔)不触发时，计时器才会触发。
下面是一个片段，它在最后一次颜色选择器更改后1秒(1000毫秒)改变标题的颜色：
jQuery(document).ready(function($){
console.log('ready');
var color = null;
var timer = null;
var changed = function(){
console.log("Changed");
$("#headlinethatchanges").css( 'color', color);
};
$('#color-picker').iris({
width: 400,
hide: false,
change: function(event, ui) {
if (timer) clearTimeout(timer);
timer = setTimeout(changed, 1000);
color = ui.color.toString();
}
});
}); <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="http://automattic.github.io/Iris/javascripts/iris.min.js"></script>
<script src="http://automattic.github.io/Iris/javascripts/prism.js"></script>
<h1 id="headlinethatchanges">Iris Test</h1>
<input type="text" id="color-picker" value="#bada55" />
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/40691435
复制相关文章
相似问题
腾讯云开发者
