Eyecon ColorPicker с помощью jquery Clone - PullRequest
0 голосов
/ 14 октября 2010

Я пытаюсь продублировать два входа и добавить палитру Eyecon Color для дублированных входов.После дублирования, когда я пытаюсь щелкнуть на вводе, выберите цвет, цвет назначается предыдущему, а не текущему.Спасибо.

<link rel="stylesheet" href="ui.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<link rel="stylesheet" media="screen" type="text/css" href="css/colorpicker.css" />
<script type="text/javascript" src="colorpicker.js"></script>

<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){
    jQuery('.color').ColorPicker({
        onSubmit: function(hsb, hex, rgb, el) {
            jQuery(el).val(hex);
            jQuery(el).css('backgroundColor', '#' + hex);
            jQuery(el).ColorPickerHide();
        },
        onBeforeShow: function () {
            jQuery(this).ColorPickerSetColor(this.value);
        }
    });
    jQuery(".cloneTableRows").live('click', function(){
        var thisTableId = 'fontmanager';
        var lastRow = jQuery('#'+thisTableId + " tr:first");
        var newRow = lastRow.clone(true);
        jQuery('#'+thisTableId).append(newRow);
        jQuery('#'+thisTableId + " tr:last td:last span").css("visibility", "visible");
        jQuery(newRow).find("input").each(function(){
            if(jQuery(this).hasClass("color")){
                jQuery(this).ColorPicker({
                    onSubmit: function(hsb, hex, rgb, el) {
                        jQuery(el).val(hex);
                        jQuery(el).css('backgroundColor', '#' + hex);
                        jQuery(el).ColorPickerHide();
                    },
                    onBeforeShow: function () {
                        jQuery(this).ColorPickerSetColor(this.value);
                    }
                });
            }
        });
        return false;
    });
    jQuery(".delRow").click(function(){
        jQuery(this).parents("tr").remove();
        return false;
    });        
});
</script>
<style type="text/css">
body{ font-family:Arial, Helvetica, sans-serif; font-size:13px; }
.remove {color:#cc0000}
.input{ border: solid 1px #006699; padding:3px}
.x{width:50px;margin-right:10px;}
.y{width:50px;margin-right:10px;}

</style>
</head>

<body>
<table id="fontmanager">
    <tr class="clone">
        <td class="font_color"><input type="text" name="color1[]" class='color'/></td>
        <td class="font_shadow"><input type="text" name="color2[]" class='color'/>
        </td>
        <td style="background-color:transparent !important; border-bottom:0px;border-right:0px !important;"><span class="delRow" style="visibility: hidden;">X</span></td>
      </tr>
    </tbody>
</table>  
<p><a href="#" class="cloneTableRows">Add More</a></p>

Рабочий пример здесь: ссылка

1 Ответ

0 голосов
/ 14 октября 2010

Скорее всего, вы используете неправильный способ назначения его событий.

, поэтому вы фактически назначаете событие, например, click, а затем клонируете его.однако событие регистрируется только для исходного ввода.поэтому клон не знает, что с ним делать, потому что он не был назначен.

Вы можете использовать метод live() при назначении событий, чтобы он проверял будущие ссылки.

uможет потребоваться также использовать die() перед live() для отмены инструкций по предварительному просмотру.

, если вышеприведенное не имеет смысла, тогда опубликуйте образец кода, чтобы мы могли попробовать и переписать его.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...