|
@@ -5,7 +5,7 @@ function grid(quantityRow, quantityColumn, place) {
|
|
var $tr = $('<tr>').appendTo($item);
|
|
var $tr = $('<tr>').appendTo($item);
|
|
|
|
|
|
for(j=0; j < quantityColumn ; j++) {
|
|
for(j=0; j < quantityColumn ; j++) {
|
|
- $('<td>').css({'border' : '1px solid #000', 'height' : '30px', 'width' : '30px'}).appendTo($tr);
|
|
|
|
|
|
+ $('<td>').css({'border' : '1px solid #000', 'height' : '30px', 'width' : '30px'}).addClass('white').appendTo($tr);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -17,15 +17,16 @@ var arr = [];
|
|
|
|
|
|
$('td').on('click', function(event) {
|
|
$('td').on('click', function(event) {
|
|
|
|
|
|
- var $black = $(this).css({'background' : '#000', 'height' : '30px', 'width' : '30px'});
|
|
|
|
- arr.push(this);
|
|
|
|
|
|
+ if ( $(this).hasClass('white') ) {
|
|
|
|
|
|
- $($black).on('click', function(event) {
|
|
|
|
- $(this).css({'background' : '#fff', 'height' : '30px', 'width' : '30px'});
|
|
|
|
|
|
+ $(this).css({'background' : '#000', 'height' : '30px', 'width' : '30px'}).removeClass('white').addClass('black');
|
|
|
|
+ arr.push(this);
|
|
|
|
|
|
- arr.splice(arr.indexOf(this), 1)
|
|
|
|
- arr.pop(this);
|
|
|
|
- });
|
|
|
|
|
|
+ }else if( $(this).hasClass('black') ) {
|
|
|
|
+
|
|
|
|
+ $(this).css({'background' : '#fff', 'height' : '30px', 'width' : '30px'}).removeClass('black').addClass('white');
|
|
|
|
+ arr.splice(arr.indexOf(this), 1)
|
|
|
|
+ }
|
|
});
|
|
});
|
|
|
|
|
|
$('#clear').on('click', function(){
|
|
$('#clear').on('click', function(){
|