<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>더하고 뺀다</title>
<script src="../lib/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(function() {
var tf = $('#tt');  // 텍스트필드
var pl = $('#plus'); //플러스버튼
var mi = $('#minus'); //마이너스버튼
var h = $('#ca'); // ul이름
var state = h // 클릭. 노클릭 상태

pl.click(function() {
if(state == h) {
var addElement = $('<li>' + tf.val() + '</li>')
}
else {
var addElement = $('<li>└' + tf.val() + '</li>')
}
state.append(addElement)
state = h
});
mi.click(function() {
state.children('li:last').remove()
state = h
});

$('ul').on('click', 'li', function() {
$('li').css('color', 'black');
$(this).css('color', 'red');
// alert($(this).text());
state = $(this);

});

});
</script>
</head>
<body>
<input type="text" id="tt">
<input type="button" value="+" id="plus">
<input type="button" value="-" id="minus">
<br />
<br />
<div>
[카테고리]
<ul id="ca">
</ul>
</div>


</body>
</html>


'it > jQuery' 카테고리의 다른 글

페이지 오픈시 제일먼저 실행 하고 싶을때.  (0) 2017.09.01
JQuery 올체크 올해제  (0) 2014.08.22
jquery tabs 긴거  (0) 2014.08.21
jquery tabs  (0) 2014.08.21
마우스오버 됫을때 그림이 바껴 신기신기  (0) 2014.08.21