Javascript-форум - Переменная в качестве ID элемента Input

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Переменная в качестве ID элемента Input (https://javascript.ru/forum/dom-window/16305-peremennaya-v-kachestve-id-ehlementa-input.html)

Переменная в качестве ID элемента Input

Добрый день.

Опыта работы с Jquery немного, потому прошу помощи.
Делаю расширенный поиск. Задача: при клике на один из чекбоксов нижнего окна - выбранный чекбокс с текстом дублируется в верхнем окне. Вставить получилось. Выглядит это примерно так:
1) http://clip2net.com/clip/m0/13018049....png?nocache=1
2) http://clip2net.com/clip/m0/13018050....png?nocache=1

Теперь надо, что если тыкаешь на этот же выделенный чекбокс в нижмем окне, то из верхнего - удаляется. Никак не могу сообразить, как это сделать.
Пытался удалить чекбокс, фильтруя его по ID: $('#tarea2 input[id=this.id]').css('display','none');}; но в качестве параметра id походу нельзя использовать переменную или не так делаю. Если же задаю явно id чекбокса $('#tarea2 input[id="nomer ID"]') - то работает для этого чекбокса. Нужно именно как-то по параметру удалить.

Подскажите, если нетрудно, это можно как реализовать .. Может вообще не в ту сторону думаю?

На всякий случай, этот кусок кода полностью:

$(':checkbox').click(function(){
var checked=this.checked;
var elem=$(this).clone();
var textelem=$(this).parents('label:first').text();
if (checked) {
newid=this.id;
elem.attr('id',newid);
elem.appendTo('#tarea2'); 
$('#tarea2').append(textelem);
}
else {
var nameval=this.id;
if (newid=nameval) {$('#tarea2').append('ну ведь равны же!!');
$('#tarea2 input[id=this.id]').css('display','none');};
         
};
});

Цитата:

Сообщение от qwaker

но в качестве параметра id походу нельзя использовать переменную или не так делаю.
$('#tarea2 input[id=this.id]')

Можно использовать, только кавычки закрывать надо. то есть так:

$('#tarea2 input[id=*!*'+this.id+'*/!*]')

Получилось!! Огромнейшее спасибо, walik! Очень выручил..

Цитата:

Сообщение от qwaker

сли аттрибут for не указывать - удаляются, естесственно, все метки. А нужно удалить только ту, кторая для чекбокса с id='+newid+'.

Опять кавычки:

$("#tarea2 label[for="+newid+"]").empty();

Какие кавычки открываете, те же и закрываете.

В вашем случае:

$("#tarea2 label[for='+newid+']").empty();

Ошибка что Вы открыли двойными кавычками, а закрываете одинарными.

Спасибо, разобрался!!

По ходу работы появился еще вопрос.

Как сделать чекбокс, который при клике на себя - удаляется (скрывается)? Сначала сделал так:

$('#tarea2 :checkbox').click(function(){
$(this).css('display','none');
   $('#tarea2 label[for="'+this.id+'"]').empty();
});

Наверное, всё бы хороошо работало, если бы этот чекбокс создавался сразу при загрузке страницы, но он создается Jquery другой функцией и потому работает только если еще раз перезапустить скрипт, когда чекбоксы уже созданы.

$('#tarea :checkbox').click(function(){
var checked=this.checked;
var elem=$(this).clone();
        };

Попробовал также к чекбоксу, который должен появиться, добавить аттрибут onclick

elem.attr('onclick','fnclick()'); и прописал функцию function fnclick(){
    $(this).css('display','none');
    $('#tarea2 label[for="'+this.id+'"]').empty();
            };

но увы, не работает =( Подскажите, что не так? И как можно реализовать задачу?

Цитата:

Сообщение от qwaker

var elem=$(this).clone();

После клонирования объекта вы должны же его еще добавить на страницу ?
типа:

var elem=$(this).clone().appendTo('body');

Ну а почему по onclick не работает сказать не могу, но воспользуетесь лучше свойством click();

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" language="javascript">
function fnclick() {
	alert('click');
}

$(document).ready(function() {
	$('#1').click(function() {
		var elem = $(this).clone();
		$(elem).click(fnclick);
		$(elem).attr('id', Math.floor(Math.random()*10000)); // случайный ID даем.
		$(document.body).append(elem);
	});
});
</script>
</head>
<body>
<input type="checkbox" id="1" />
</body>
</html>

Так же не забывайте менять ID (если используются) при клонирование, что бы они не повторялись.

Сделал по вашему аналогу - с небольшими правками под свой код - всё получилось! Спасибо!

Не много не в тему но вопрос про ID.
Создал простой скрипт по раскрытию скрытию divов с эфектом из jquery... Все работает, но появилась необходимость избавится от кучи ID которые приходится вбивать в каждый div. Соответственно для каждого diva разный id.

function exdiv(id)
{
if($(id).css('display')=='none')
{
$(id).animate({height: 'show'}, 750);
}
else
{
$(id).animate({height: 'hide'}, 750);
}
}

<div onclick="exdiv('#1'); return false;">
<div id="1" style="display: none;">Блок с ID 1...</div>
<div onclick="exdiv('#2'); return false;">
<div id="2" style="display: none;">Блок с ID 2...</div>

Можно ли как то изменить скрипт чтобы ID был универсален, т.е. для всех divов был один...
До этого у меня был скрипт который позволял так делать, но в нем я так и не смог разобраться, так и не понял где там этот универсальный ID прописывается...
Вот код скрипта с универсальным ID аля expandit(this):

var ns6=document.getElementById&&!document.all?1:0
var head="display:''"
var folder=''
function expandit(curobj)
{
folder=ns6?curobj.nextSibling.nextSibling.style:document.all[curobj.sourceIndex+1].style
if (folder.display=="none")
folder.display=""
else
folder.display="none"
}

<div onclick="expandit(this)">
<div style="display: none;">111</div>
<div onclick="expandit(this)">
<div style="display: none;">222</div>

Помогите разобраться.