Добавить / удалить элементы динамически - PullRequest
0 голосов
/ 07 апреля 2011

Теперь я сделал ДОБАВИТЬ / Удалить элементы

Как динамически добавлять / удалять элементы, перестаньте находить вложение изображения, которое показывает более понятную категорию enter image description here

, которая заполняет записииз таблицы категорий базы данных, и когда пользователь выбирает конкретную категорию, тогда подкатегория будет заполняться из таблицы подкатегории базы данных,

ищу один jquery или несколько открытых, которые выполняют эту же работу,

ссылаются на некоторыехорошие плагины,

Как добавить элемент, когда я нажимаю ДОБАВИТЬ Elment, пожалуйста, проверьте мой код ниже

       <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
<script type="text/javascript" >
$(document).ready(function(){
var hdn_add_element_cnt = $("#hdn_add_element_cnt").val();
        hdn_add_element_cnt = parseInt(hdn_add_element_cnt);
        var app_str = "<div id=element_"+hdn_add_element_cnt+">New Element  "+hdn_add_element_cnt+" <a href=\"#\" onclick=\"delete_element("+hdn_add_element_cnt+")\">Delete</a></div>";
        $('#element_area').append(app_str);

    $("#add_element").click(function(){
        var hdn_add_element_cnt = $("#hdn_add_element_cnt").val();
        hdn_add_element_cnt = parseInt(hdn_add_element_cnt);
        hdn_add_element_cnt = hdn_add_element_cnt+1;
        var app_str = "<div id=element_"+hdn_add_element_cnt+">New Element  "+hdn_add_element_cnt+" <a href=\"#\" onclick=\"delete_element("+hdn_add_element_cnt+")\">Delete</a></div>";
        $('#element_area').fadeIn(10000).append(app_str);
        //Increment Elemenet ID Count +1

        document.getElementById("hdn_add_element_cnt").value = hdn_add_element_cnt;

    })
})

function delete_element(element_id_no){
    var get_element_hidden_cnt = $("#hdn_add_element_cnt").val();
    $("#element_"+element_id_no).fadeOut(100).remove();
}
</script>
</head>
<body>
<div style="width:500px; height:200px; background-color:#FF0000;">
    <div id="add_element" style="width:400px; height:75px;">
        ADD Element
    </div>
    <div id="element_area">

    </div>
</div>
<input type="hidden" id="hdn_add_element_cnt" value="1" />
</body>
</html>

1 Ответ

1 голос
/ 07 апреля 2011

jQuery не требует плагинов для этого.Стандартные функции работают хорошо:

.append() добавляет элементы, поэтому для добавления <div> к <body> просто сделайте это:

$('body').append('<div id="foobar">This is my text</div>');

.remove() аналогичным образом удаляет элементы, поэтому для удаления добавленного вами <div> просто сделайте следующее:

$('#foobar').remove();

.html() и .text() можно использовать для установки содержимого элемента..text() обычно используется для установки отображаемого текста, а .html() - для добавления элементов содержимого:

$('#foobar').text('Hello');
$('#foobar').html('<h1 class="foo">Hello</h1>');

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

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