VPF::проблемы с чекбоксами - Форум программистов

Hurray

Дата 17.3.2012, 20:29 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 16
Регистрация: 25.11.2011

Репутация: нет
Всего: нет

Добрый день. Хочу сделать, чтобы при клике на чекбокс, он копировался в блок "<div class="container"></div>". Нужно, чтобы отмеченные чекбоксы дублировались.

Код


<div class="container"></div>
<input type="checkbox" name="checkbox_name" value="1">первый чекбокс<br>
<input type="checkbox" name="checkbox_name" value="2">второй чекбокс<br>
<input type="checkbox" name="checkbox_name" value="3">третий чекбокс<br>

Почему не работает такой скрипт?

Код


$(document).ready(function() {
    $('input[type="checkbox"]').click(function () {
        $('this').clone().appendTo(".container");
    });
});

После чекбокса идёт текст, не заключённый ни в какие теги, просто текст. Можно ли сделать, чтобы он копировался вместе с чекбоксом?
Как сделать, что бы при клике на чекбокс, находящийся в блоке "<div class="container"></div>", он удалялся оттуда, а чекбокс с тем же значением атрибута "value" вне блока становился бы неотмеченным?
Когда проверяю файербагом чекбоксы, отмеченные ни чем не отличаются от неотмеченных. Насколько я знаю, у отмеченных должен быть атрибут checked="checked", но файербаг почему-то его не видит. В чем тут дело?

Amphiluke

Дата 17.3.2012, 20:49 (ссылка)

(голосов:1)

Загрузка ...

☽

Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 39
Всего: 112

Цитата(Hurray @ 18.3.2012, 00:29

)

$('this')

Здесь не нужны кавычки.

Цитата(Hurray @ 18.3.2012, 00:29

)

После чекбокса идёт текст, не заключённый ни в какие теги, просто текст. Можно ли сделать, чтобы он копировался вместе с чекбоксом?

можно воспользоваться свойством nextSibling, и так же склонировать текстовый узел его методом .cloneNode (это метод DOM, а не jQuery)

Цитата(Hurray @ 18.3.2012, 00:29

)

Как сделать, что бы при клике на чекбокс, находящийся в блоке "<div class="container"></div>", он удалялся оттуда, а чекбокс с тем же значением атрибута "value" вне блока становился бы неотмеченным?

Код


$("div.container").delegate("input[type='checkbox']", "click", function() {
    $("input[value=" + this.value + "]")[0].checked = false;
    $(this).remove();
});

Цитата(Hurray @ 18.3.2012, 00:29

)

Насколько я знаю, у отмеченных должен быть атрибут checked="checked", но файербаг почему-то его не видит. В чем тут дело?

Смотрите на вкладке DOM.

ksnk

Дата 17.3.2012, 22:46 (ссылка)

(голосов:1)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 48
Всего: 386

Цитата(Hurray @ 17.3.2012, 20:29

)

После чекбокса идёт текст

Лучше обрамить весь чекбокс вместе с текстом тегом label. Так и копировать будет проще и функционировать будет логичнее - нажал на текст - поменял чекбокс.
<label><input type="checkbox" name="checkbox_name" value="1">первый чекбокс</label><br>

А если чекбокс отмечен много раз - много копий должно появится? Может так будет лучше?

Код


$('input[type="checkbox"]').click(function () {
    if(this.checked){
        $(this).data('clone',$(this).parent().clone().appendTo(".container"));
    } else {
        $(this).data('clone').remove();        
    }
});

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »