Я работаю над функцией jquery, чтобы (1-й) добавить элементы в неупорядоченный список по умолчанию (животное) и (2) показать/скрыть "deletebutton" в элементах списка (включая новые элементы меню), когда вы нажимаете "editBtn" ". Я хочу выбрать ВСЕ элементы списка, но он отображается только на последнем элементе.
JS
$(function() {
var cat = $('<li><a href="#" class="">Cat</a></li>');
var dog = $('<li><a href="#" class="">Dog</a></li>');
var lion = $('<li><a href="#" class="">Lion</a></li></li>');
var deletebutton = $('<input class="delBtn" type="submit" value="delete"/>');
$('ul#animal li').append(deletebutton);
$('#editBtn').click(function(){
deletebutton.toggle();
});
//limit to one click event
$('#addCat').one("click", function() {
$(cat).hide().prependTo('ul#animal').fadeIn("slow");
});
$('#addDog').one("click", function() {
$(dog).hide().prependTo('ul#animal').fadeIn("slow");
});
$('#addLion').one("click", function() {
$(lion).hide().prependTo('ul#animal').fadeIn("slow");
});
});
HTML
<div class="menu">
<a href="javascript:void(0)" id="addCat">AddCat </a>
<a href="javascript:void(0)" id="addDog">AddDog </a>
<a href="javascript:void(0)" id="addLion">AddLion</a>
</div>
<br />
<br />
<div>
<a href="#" id="editBtn">Edit Button</a>
</div>
<div class="screen">
<ul id="animal">
<li><a href="#" class="">Bird</a></li>
<li><a href="#" class="">Snake</a></li>
<li><a href="#" class="">fish</a></li>
</ul>
</div>
CSS
.menu{
background-color: yellow;
display: inline;
}
.screen{
background-color: grey;
}
.delBtn{
display:none;
}
jsfiddle http://jsfiddle.net/Ne63M/
Измените объявление переменной на
var deletebutton = '<input class="delBtn" type="submit" value="delete"/>';
Поскольку он добавит новый ввод для каждого элемента, а затем изменит событие click на:
$('#editBtn').click(function(){
$(".delBtn").toggle();
});
Вам нужно будет клонировать deletebutton
, иначе ссылка указывает на те же экземпляры:
$('ul#animal li').append(deletebutton.clone());
Затем вы можете ссылаться на них по классу вместо переменной:
$('.delBtn').//stuff
li
, захватил бы их.