JQuery клонировать несколько случаев, почему - PullRequest
Новая
       5

JQuery клонировать несколько случаев, почему

2 голосов
/ 24 июня 2010

Надежда может помочь, пробуя клон Jquery, который, кажется, работает, но я получаю "несколько" клонов, а не одиночные клоны при "нажатии" кнопки.

Например: я хочу клонировать это: 

echo '<select class="hello">';
    foreach ($pageposts as $post):
    echo '<option>'.$post->post_title.'</option>';
    endforeach;
    echo '</select>';

по клику этого 

echo '<input type="button" id="rp" value="add">';

Да из WordPress и Да, класс "привет" из страниц JQuery

Моя функция JQuery: 

$j=jQuery.noConflict();
$j(document).ready(function() {
$j('#rp').click(function(){ 
$j('.hello').clone().appendTo('#goodbye');
});
});

Итак, мой «общий фрагмент кода» выглядит следующим образом: 

echo '<select class="hello">';
foreach ($pageposts as $post):
echo '<option>'.$post->post_title.'</option>';
endforeach;
echo '</select>';
echo '<div id="goodbye"></div>';
echo '<input type="button" id="rp" value="add">';

Я клонирую «один раз» при первом нажатии, но затем он становится кратным, т. Е .:

1 клик дает 1 клон плюс 1 оригинал - что я хочу

2 клика дают 3 клона плюс 1 оригинал - не то, что я хочу, я хочу 1 оригинал плюс 2

3 клика дают 7 клонов плюс 1 оригинал - не то, что я хочу, я хочу 1 оригинал плюс 3 и т.д.

Предложения, пожалуйста. Спасибо

Ответы [ 2 ]

6 голосов
/ 24 июня 2010

Это потому, что ваш селектор ищет класс: 

$j('.hello')

Каждый раз, когда вы клонируете и добавляете это к другому элементу, вы добавляете еще один элемент .hello, поэтому вы клонируете каждый элемент .hello, который он может найти.

Возможно, вам следует удалить имя класса, когда оно было клонировано: 

$j('.hello').clone().removeClass('hello').appendTo('#goodbye');

Или, возможно, даже изменить его: 

$j('.hello').clone().removeClass('hello').addClass('cloned_hello').appendTo('#goodbye');

Возможно, вы захотите добавить другой класс, чтобы ваш CSS все еще работал, но в конечном итоге именно поэтому вы получаете несколько клонированных элементов.

1 голос
/ 24 июня 2010

поведение нормальное, потому что вы клонируете каждый элемент, в котором есть класс hello.

Попробуйте это: 

$j('.hello').clone().attr("class","cloned").appendTo('#goodbye');

И вы вставите в свой CSS то же самое в .clonedкак в .hello.

Надеюсь, это поможет:)

...