23.09.2014, 21:11
|
|
Аспирант
|
|
Регистрация: 11.04.2014
Сообщений: 60
|
|
Не работает ajax удаление, из-за повторного подключения файла.
Код сокращен, для более внятного описания проблемы.
Есть вот такой код:
$("#addNew").click(function(){
$.ajax({
type: "POST",
data: "newCat="+$('#CatAdd').val(),
url: "http://"+window.location.hostname+"/include/ajax/del.php",
success: function(categ){
$(".category").append("<li id='i1'>new</li>");
$.ajax({ url: "http://"+window.location.hostname+"/js/del.js" }); //удаление
}
}
});
});
del.js содержит и написан, для того, что бы удалять, вновь созданные объекты через append:
$('.deletes').click(function(){
if (confirm('Вы уверены, что удалить?') {
$.ajax({
type: "POST",
data: "id="+$(this).attr("data-id")+"",
url: "http://"+window.location.hostname+"/include/ajax/dels.php",
success: function(del){
$('#th'+del.id).html("").hide();
}
});
} else {}
});
И если первый <li> он удаляет без проблем. То во второй раз, он спрашивает уже 2 раза, на 3 три и т.д.
Если добавить сразу 5 <li> то файл url: "http://"+window.location.hostname+"/include/ajax/del.php", прогрузится все 5 раз. И соответствено при нажатии на $('.deletes').click(function()
Он спросит меня все 5 раз, действительно ли я уверен.
Подскажите пожалуйста как можно с этим бороться?
|
|
23.09.2014, 21:48
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
Сообщение от light
|
Код сокращен, для более внятного описания проблемы.
|
то есть для того, чтобы сделать его совсем невменяемым
для внятного описания проблемы делают тестовые примеры,
додумывать за тебя html- и php-содержимое никто не собирается + приведённое описание кода ему противоречит
ждём тест, а вопрос - на х-я зачем такие навороты - пока оставим
Последний раз редактировалось bes, 23.09.2014 в 21:51.
|
|
23.09.2014, 22:34
|
|
Аспирант
|
|
Регистрация: 11.04.2014
Сообщений: 60
|
|
bes,
Извините, просто на форум я обращаюсь в крайнем случае, предварительно перебрав все возможные варианты, насколько хватает знаний, и под конец в голове полная каша, что и приводит к таким не совсем понятным темам. Мне казалось проблема ясна)
Специально для темы, сделал демо версию проблемы)
Код:
$(function() {
$(".del").click(function(){
if (confirm('Вы уверены, что хотите удалить?')) {
$("#l"+$(this).attr("data-id")).hide();
} else {}
});
$("#new").click(function(){
$.ajax({
type: "POST",
data: "test="+$("#col").val(),
url: "http://"+window.location.hostname+"/include/ajax/test.php",
success: function(test){
$("#col").val(test.id);
$(".test").append("<li id='l"+test.id+"' data-id='"+test.id+"'>"+test.id+" <input type='submit' value='del' class='del' data-id="+test.id+" id='del"+test.id+"' /></li>");
}
});
});
});
<input type="submit" value="new" id="new" />
<ul class="test">
<li id="l1" data-id="1">1 <input type="submit" value="del" class="del" data-id="1" id="del1" /></li>
<li id="l2" data-id="2">2 <input type="submit" value="del" class="del" data-id="2" id="del2" /></li>
</ul>
<input type="text" value="2" id="col" />
Файл ajax/test.php прибавляет 1 и возвращает id
<? header("Content-type:application/json;"); $id = (int)$_POST['test']+1;?>
{ "id": "<?=$id;?>" }
Проблема в том, что при таком коде, новые <li> не удаляются.
Что бы они удалялись, нужно прописать вот так:
$(function() {
$(".del").click(function(){
if (confirm('Вы уверены, что хотите удалить?')) {
$("#l"+$(this).attr("data-id")).hide();
} else {}
});
$("#new").click(function(){
$.ajax({
type: "POST",
data: "test="+$("#col").val(),
url: "http://"+window.location.hostname+"/include/ajax/test.php",
success: function(test){
$("#col").val(test.id);
$(".test").append("<li id='l"+test.id+"' data-id='"+test.id+"'>"+test.id+" <input type='submit' value='del' class='del' data-id="+test.id+" id='del"+test.id+"' /></li>");
$(".del").click(function(){
if (confirm('Вы уверены, что хотите удалить?')) {
$("#l"+$(this).attr("data-id")).hide();
} else {}
});
}
});
});
});
Но вот тут у меня и возникает та самая проблема. Я её вижу так: каждый раз когда я добавляю новый <li> этот код так же прописывается каждый раз.
А потом соответственно и вызывается 5 раз вместо одного.
|
|
23.09.2014, 23:42
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
потому что ты каждым кликом вешаешь дополнительный обработчик на каждую кнопку
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<button class="but">click</button>
<button class="but2">click after</button>
<script>
$(function () {
var n = 0;
$(".but").click(function () {
n++;
$(".but2").click(function () {
console.log(n);
});
});
});
</script>
а вот ответ на вопрос - зачем такие навороты
<input type="button" value="new" id="new" />
<ul class="test">
<li id="l1" data-id="1">1 <input type="submit" value="del" class="del" data-id="1" id="del1" /></li>
<li id="l2" data-id="2">2 <input type="submit" value="del" class="del" data-id="2" id="del2" /></li>
</ul>
<input type="text" value="2" id="col" />
<script>
$(function() {
//$(".del").click(function(){
*!*$(".test").on("click", ".del", function(){*/!*
if (confirm('Вы уверены, что хотите удалить?')) {
$("#l"+$(this).attr("data-id")).hide();
} else {}
});
$("#new").click(function(){
$.ajax({
type: "POST",
data: "test="+$("#col").val(),
url: "test.php",
success: function(test){
$("#col").val(test.id);
$(".test").append("<li id='l"+test.id+"' data-id='"+test.id+"'>"+test.id+" <input type='submit' value='del' class='del' data-id="+test.id+" id='del"+test.id+"' /></li>");
/*$(".del").click(function(){
if (confirm('Вы уверены, что хотите удалить?')) {
$("#l"+$(this).attr("data-id")).hide();
} else {}
});*/
}
});
});
});
</script>
|
|
24.09.2014, 12:36
|
|
Аспирант
|
|
Регистрация: 11.04.2014
Сообщений: 60
|
|
bes,
Такие навороты были нужны потому что по другому не умел) Спасибо большое!
А не подскажете еще один момент? Как сделать тоже самое, только с наведением мышки?
Есть вот такой код:
$('.titleCat, .editCat, .delCat').hover(function(){
$('#e'+$(this).attr("data-id")+', #delc'+$(this).attr("data-id")).css("display","block");
},function(){
$('#e'+$(this).attr("data-id")+', #delc'+$(this).attr("data-id")).hide();
});
<li id="li130" class="ui-state-default connectedSortable sortables ui-sortable" data-id="130">
<div class="titleCat end" data-id="130"></div>
<img id="e130" class="editCat" data-id="130" alt="" src="/images/editlink.png" style="">
<img id="delc130" class="delCat" data-id="130" alt="" src="/images/delete.png" style="">
</li>
Вот так не срабатывает:
$(".sortables").on("hover", ".titleCat, .editCat, .delCat", function(){
//$('.titleCat, .editCat, .delCat').hover(function(){
$('#e'+$(this).attr("data-id")+', #delc'+$(this).attr("data-id")).css("display","block");
},function(){
$('#e'+$(this).attr("data-id")+', #delc'+$(this).attr("data-id")).hide();
});
|
|
24.09.2014, 21:55
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
http://api.jquery.com/on/
Цитата:
|
Deprecated in jQuery 1.8, removed in 1.9: The name "hover" used as a shorthand for the string "mouseenter mouseleave". It attaches a single event handler for those two events, and the handler must examine event.type to determine whether the event is mouseenter or mouseleave. Do not confuse the "hover" pseudo-event-name with the .hover() method, which accepts one or two functions.
|
Не путайте имя псевдо-события "hover" с методом .hover(), который принимает на вход одну или две функции.
нормальные примеры надо делать - нажал и посмотрел
я не понял чего ты там хотел добиться
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<div class="div">
<img id="img1" class="img" data-id="2" src="http://javascript.ru/forum/image.php?u=34470&dateline=1397213510" /><br/>
<img id="img2" class="img" data-id="1" src="http://javascript.ru/forum/image.php?u=19820&dateline=1334914235" />
<div id="div1">light</div>
<div id="div2">bes</div>
</div>
<script>
$(".div .img").hover(
function(){
$("#img" + $(this).attr('data-id') + ", #div" + $(this).attr("data-id")).hide();
},
function(){
$("#img" + $(this).attr('data-id') + ", #div" + $(this).attr("data-id")).show();
}
);
</script>
сегодня целый день что-то происходит?
http://api.jquery.com/
UPD:
--------------
Common, guyz!. All your base are belong to us.
Just please reinstall dat backdoored openssh deamon. And all will be fine.
root@jq01:~# who
scottgonzalez pts/1 2014-09-24 11:18 (pool-72-**-27-9.hrbgpa.****.verizon.net)
s5fs pts/0 2014-09-24 11:16 (c-24-**-82-162.hsd1.or.*****.net)
ryanneufeld pts/3 2014-09-24 11:36 (s0106002618c70459.**.shawcable.net)
gnarf pts/4 2014-09-24 11:43 (50.***.62.97)
--------------
I'm looking for a new job, I'm so sorry for this experiment with iframe, no one was injured, all files was permanently deleted.
Greetz: Umputun, Bobuk, Gray, Ksenks @ radio-t.com
My PGP public key is:
-----BEGIN PGP PUBLIC KEY BLOCK-----
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
=cECx
-----END PGP PUBLIC KEY BLOCK-----
|
|
|
|