Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.05.2013, 03:34
Интересующийся
Отправить личное сообщение для tiksi Посмотреть профиль Найти все сообщения от tiksi
 
Регистрация: 15.05.2013
Сообщений: 15

Добавление строк в таблицу (JQuery)
Доброго времени суток.
Прошу помощи у профессионалов.
Вот код:
<!DOCTYPE HTML>
<html lang="ru-RU">
<head>

<meta charset="UTF-8">
<title> </title>
<script type="text/javascript" src="http://yandex.st/jquery/1.4.2/jquery.js"></script>

<script>
$(document).ready(function(){
var comments = "_"; $('.addComment').click(function() {
$('#comments').append('<tr id="'+comments+'"><td><input type="text"/></td><td><input type="button" class="star" value="*"/></td><td><div class="removeComment" comment_id="'+comments+'">x</div></td></tr>');
});

$('#comments').delegate('.removeComment', 'click', function(e) {
var id = $(this).attr('comment_id');
$('#'+id).remove(); e.preventDefault();
});

$(".star").click(function () {
alert('star');
});

$(".removeComment_first").click(function(){
$('.b-login5__adress').fadeOut(300);
});
$("#some_adress2").click(function () {
$('.b-login5__adress').fadeOut(300);
});
});
</script>

<script>//popap
$(document).ready(function(){
$('#toggleadress3').dopPopup($('#adress3'));
});

(function($, window) {
$.fn.dopPopup = function($adress3) {
var $self = this,
$window = $(window);

return this.click(
function() {
$adress3.fadeIn(300).bind('click.bLogin5', function(event){
event.stopPropagation();
});
return false;
},
function(){
$adress3.fadeOut(300).unbind('.bLogin5');
$window.unbind('.bLogin5');
return false;
}
);
};
})(jQuery, window);
</script>
<style>
.some_adress_wrap{height: 20px; width: 189px; position: relative; margin: 7px 0 0px 0;}
#some_adress {border-bottom: 1px dashed black; cursor: pointer; position: relative; float: right; margin: -4px 5px 0px 0;color: #575656}
#some_adress2 {border-bottom: 1px dashed black; cursor: pointer; position: relative; float: right; margin: -26px 15px 0px 0;color: #575656}
#some_adress:hover, #some_adress_return:hover{border: 0;}
#some_adress_return {border-bottom: 1px dashed black; cursor: pointer; position: relative; z-index:2; float: right; display: none;margin: -4px 5px 0 0;color: #575656;}
.b-login5__adress { background: #bebebe;display: none; left: -5px; top: 22px; position: absolute; z-index:4;}
</style>

<body>
<div class="some_adress_wrap">
<div id="toggleadress3">
<a id="some_adress">Добавить адрес</a>
</div>
<div class="b-login5__adress" id="adress3">
<a id="some_adress2">Добавить адрес</a>
<table id="comments">
<tr>
<td><input type="text" /></td>
<td><input type="button" class="star" value="*"/></td>
<td><div class="removeComment_first">x</div></td>
</tr>
</table>
<table class="table_add_buttons">
<tr>
<td>
<div class="addComment"><a href="#" class="main_bold_font">+ Добавить адрес</a></div>
</td>
</tr>
</table>
</div>
</div>
</body>

</html>

1) При добавлении строк в таблицу не работает кнопка со звездочкой.
2) Как сделать чтобы если первая строка одна, то первый крестик закрывал весь попап(как в данный момент). Но когда мы кликаем на ссылку +Добавить адрес (соответственно добавляется 2 строки и более) первый крестик не закрывал попап, а удалял текущую строку.
Пытаюсь, но за неимением опыта не могу реализовать.
Очень надеюсь на Вашу помощь.
Заранее благодарю.
Ответить с цитированием
  #2 (permalink)  
Старый 16.05.2013, 04:20
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Оберни код в
[html run] код.. [/html]
Ответить с цитированием
  #3 (permalink)  
Старый 16.05.2013, 08:01
Интересующийся
Отправить личное сообщение для tiksi Посмотреть профиль Найти все сообщения от tiksi
 
Регистрация: 15.05.2013
Сообщений: 15

<!DOCTYPE HTML>
<html lang="ru-RU">
<head>

<meta charset="UTF-8">
<title> </title>
<script type="text/javascript" src="http://yandex.st/jquery/1.4.2/jquery.js"></script>

<script>
$(document).ready(function(){
var comments = "_"; $('.addComment').click(function() {
$('#comments').append('<tr id="'+comments+'"><td><input type="text"/></td><td><input type="button" class="star" value="*"/></td><td><div class="removeComment" comment_id="'+comments+'">x</div></td></tr>');
}); 

$('#comments').delegate('.removeComment', 'click', function(e) {
var id = $(this).attr('comment_id');
$('#'+id).remove(); e.preventDefault();	
});

$(".star").click(function () {
alert('star');
});

$(".removeComment_first").click(function(){
$('.b-login5__adress').fadeOut(300);
});
$("#some_adress2").click(function () {
$('.b-login5__adress').fadeOut(300);
});
});
</script>

<script>//popap
$(document).ready(function(){
$('#toggleadress3').dopPopup($('#adress3'));
});

(function($, window) {
$.fn.dopPopup = function($adress3) {
var $self = this,
$window = $(window);

return this.click(
function() {
$adress3.fadeIn(300).bind('click.bLogin5', function(event){
event.stopPropagation();
});
return false;
},
function(){
$adress3.fadeOut(300).unbind('.bLogin5');
$window.unbind('.bLogin5');
return false;
}
);
};
})(jQuery, window);
</script>
<style>
.some_adress_wrap{height: 20px; width: 189px; position: relative; margin: 7px 0 0px 0;}
#some_adress {border-bottom: 1px dashed black; cursor: pointer; position: relative; float: right; margin: -4px 5px 0px 0;color: #575656}
#some_adress2 {border-bottom: 1px dashed black; cursor: pointer; position: relative; float: right; margin: -26px 15px 0px 0;color: #575656}
#some_adress:hover, #some_adress_return:hover{border: 0;}
#some_adress_return {border-bottom: 1px dashed black; cursor: pointer; position: relative; z-index:2; float: right; display: none;margin: -4px 5px 0 0;color: #575656;}
.b-login5__adress { background: #bebebe;display: none; left: -5px; top: 22px; position: absolute; z-index:4;}
</style>

<body>
<div class="some_adress_wrap">
<div id="toggleadress3">
<a id="some_adress">Добавить адрес</a>
</div>
<div class="b-login5__adress" id="adress3">
<a id="some_adress2">Добавить адрес</a>
<table id="comments">
<tr>
<td><input type="text" /></td>
<td><input type="button" class="star" value="*"/></td>
<td><div class="removeComment_first">x</div></td>
</tr>
</table>
<table class="table_add_buttons">
<tr>
<td>
<div class="addComment"><a href="#" class="main_bold_font">+ Добавить адрес</a></div>
</td>
</tr>
</table>
</div>
</div>
</body>

</html>
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как добавить таблицу в cookie? jQuery derbass jQuery 7 24.12.2012 08:05
Несколько строк из mootols в jquery Ingiborn jQuery 15 24.01.2012 15:10
Добавление строк в таблицу MCTrane Общие вопросы Javascript 14 28.11.2010 18:18
Добавление строк в текущий документ deerstop Общие вопросы Javascript 11 24.09.2009 23:17
Добавление строк в таблицу stanlee Элементы интерфейса 13 11.06.2008 17:38