[英]get parent element ID of a spectrum color picker
我在2个不同的div内有2个颜色选择器。
<div class="panel-heading" style="width:100%" id="h1">
<span style="float:right; padding-right:10px;" class="close"> <input type='text' class="basic" id="t1"/> </span>
</div>
<div class="panel-heading" style="width:100%" id="h2">
<span style="float:right; padding-right:10px;" class="close"> <input type='text' class="basic" id="t2"/> </span>
</div>
这是我的频谱图选择器JS:
$(document).ready(function () {
$(".basic").spectrum({
color: "rgb(244, 204, 204)",
showPaletteOnly: true,
hideAfterPaletteSelect: true,
change: function (color)
{
setBackgroundColor(color);
},
palette: [
["rgba(168, 255, 102, 0.29)", "rgb(67, 67, 67)", "rgb(102, 102, 102)",
"rgb(204, 204, 204)", "rgb(217, 217, 217)", "rgb(255, 255, 255)"],
["rgb(152, 0, 0)", "rgb(255, 0, 0)", "rgb(255, 153, 0)", "rgb(255, 255, 0)", "rgb(0, 255, 0)",
"rgb(0, 255, 255)", "rgb(74, 134, 232)", "rgb(0, 0, 255)", "rgb(153, 0, 255)", "rgb(255, 0, 255)"]
]
});
});
现在在setBackgroundColor()函数内部,我如何才能知道我选择了哪个颜色选择器div(我正在尝试更改div的背景色),即H1或H2。
注意:我不想在jquery中以$("#t1").spectrum
发送输入ID。
请帮我。 提前致谢。
您可以使用this
,但是这将捕获输入元素,因为插件已.basic
到.basic
元素。 要获取父项本身,只需使用.parent()
或.closest()
:
$(".basic").spectrum({
color: "rgb(244, 204, 204)",
showPaletteOnly: true,
hideAfterPaletteSelect: true,
change: function (color) {
// use this
console.log(this); // will show <input type='text' class="basic" id="t1"/>
// to access parent element use .closest
console.log( $(this).closest('.panel-heading') );
// or
console.log( $(this).closest('.close') );
setBackgroundColor(color);
},
});
也许这对您有用。
$("#h1").focus(function() {
//code when div #h1 focused
});
$("#h2").focus(function() {
//code when div #h2 focused
});
要么
this
如Norlihazmey Ghazali所说,具有聚焦功能
感谢大家的帮助。
这是如何更改其父bgcolor:
change: function (color)
{
$(this).parent().parent().css('background',color);
},
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.