1

我想添加一个颜色选择器字段，总是在用户单击链接时。问题是，只有第一个颜色选择器在工作。我不知道为什么它不起作用，因为没有错误

这是我的代码：

<script>

    $(function() {
            var scntDiv = $('#p_scents');
            var i = $('#p_scents p').size() +1;

            $('#addScnt').live('click', function() {

                    if( i <= 10 ){

                    $('<p><label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt_' + i +'" value="" placeholder="add new category" /></label> <a href="#" id="remScnt">[ - ]</a> | bar color: </p><input name="color'+ i +'" " class="cPicker" id="colorpickerField'+ i +'" type="text" value="00ff00" size="6" maxlength="6" />').appendTo(scntDiv);
                    i++;
                    return false;
                    }
            });

            $('#remScnt').live('click', function() {
                    if( i > 2 ){
                        $(this).parents('p').remove();

                        i--;
                        $("#colorpickerField"+i).remove();
                        console.log("#colorpickerField"+i);

                    }
                    return false;
            });
    });


    $(function(){
        $('#colorpickerField1, #colorpickerField2, #colorpickerField3').ColorPicker({
        onSubmit: function(hsb, hex, rgb, el) {
            $(el).val(hex);
            $(el).ColorPickerHide();
            $(el).css({'background-color' : '#'+hex});
        },
        onBeforeShow: function () {


    $(this).ColorPickerSetColor(this.value);
    }
    })
    .bind('keyup', function(){
    $(this).ColorPickerSetColor(this.value);
    });
});
</script>

这里是html部分：

 <form method="post" name="lineForm" action="<?php echo $_SERVER['PHP_SELF'].'?file=settings&t=diagramm'; ?>" >


                    <div class="addCatsContainer" id="p_scents">
                        <p>
                            <label for="p_scnts">
                                <input type="text" id="p_scnt" size="20" name="p_scnt" value="<?php $_POST['p_scnt']; ?>" placeholder="add new category" />
                            </label><a href="#" id="addScnt">[+]</a> <span class="barColor">| bar color:</span>


                        </p>

                            <input class="cPicker" id="colorpickerField1" name="color" type="text" value="00ff00" value="<?php $_POST['color']; ?>" size="6" maxlength="6" />

                        </div>     

                          <div style="clear:both;"></div>





                    <input type="submit" name="submit" value="save" />
</form>

有人能帮助我吗？谢谢

更新：

当下面的行被复制时，它就会起作用。

<input class="cPicker" id="colorpickerField1" name="color" type="text" value="00ff00" value="<?php $_POST['color']; ?>" size="6" maxlength="6" />

当输入字段使用 jquery 呈现时，它只是不起作用。

4

0 回答 0