Question

我有一个带有2个标签的bootstrap popover，在First标签上，用户可以上传图像，在第二个标签上，用户可以使用颜色标签选择颜色，popover正在工作，并且popover内的标签正在工作，但是colorpicker无法处理Document Ready，

Jquery的

$('.specular_color').colpick({
flat:true,
layout:'hex',
submit:0,
onChange:function(hsb,hex,rgb,el,bySetColor) 
{   
$('.specular_color').css('border-color','#'+hex);
specularmap_color='#'+hex;
specularmap_texture="";
$(".specular_img").css("display","none");
$( ".specular_img" ).parent().css("background-color",'#'+hex);
specular_color=hex;
meshphong.specular=increase_brightness(specular_color, 0);
load_meshphong();
}
});
$('.emission_color').colpick({
flat:true,
layout:'hex',
submit:0,
onChange:function(hsb,hex,rgb,el,bySetColor) 
{   
$('.emission_color').css('border-color','#'+hex);
specularmap_color='#'+hex;
specularmap_texture="";
$(".specular_img").css("display","none");
$( ".specular_img" ).parent().css("background-color",'#'+hex);
emission_color=hex;
meshphong.emissive=increase_brightness(emission_color, 0);
load_meshphong();
}
});

HTML：

<div class="tabbable hide" id="specular_popover">
<ul class="nav nav-tabs clsacc_Tab">
<li class="active"><a href=".specular1" data-toggle="tab">Texture</a></li>
<li class="tab"><a href=".specular2" data-toggle="tab">Color</a></li>
</ul>
<div class="tab-content" style="padding-top: 15px">
<div class="tab-pane active specular1" >
<div class="children">
<div class="widget button-widget">
<button class="btn btn-primary" data-toggle="modal" data-target="#textures_modal">Manage textures</button>
</div>
<?php 
if($textures=get_data('mv_textures',array('user_id'=>user_id()))->result())
{
?>
<select name="specular1textures" class="form-control">
<?php
$cnt=0; 
foreach($textures as $row)
{
$cnt++;?>
<option value="<?php echo $row->textures_file?>">
<?php  if(!$row->textures_file) echo'Material '.$cnt.': ';else echo $row->textures_file;?>
</option>
<?php 
}
?>
</select>
<?php 
}?>
</div>
</div>
<div class="tab-pane specular2">
<div class="panel-body specular_color" id=""></div>
</div>
</div>
</div>

以及带有标签

的弹出窗口的示例

示例小提琴是：Fiddle

Answer 1

如果你在颜色选择器之后启动弹出窗口，它会起作用。

$('.specular_color').colpick({
    flat:true,
    layout:'hex',
    submit:0,
 });

 $(".specular_popover_trigger").popover({html: true,trigger:"click",placement:      "bottom",content: $('#specular_popover').html()});

Colorpicker不在引导程序弹出窗口内工作

1 个答案: