2012-02-09 2 views
0
function removeNewsItem(id,idStamp,obj){ 
$('#whiteCover')show(); 

$('#contentOfBox').html= ('Are you sure you want ot completely remove this news item?<br/><br/><div style="text-align:center;"><input type="button" class="button blue medium" onclick="removeNewsItemConfirmed(\'' + id + '\',\''+idStamp+'\','+**obj**+')" value="Yes"/> <input type="button" class="button red medium" value="No" onclick="resetContentBox();"/></div>'); 

$("#whiteCoverContainer").fadeIn(); 
} 

function removeNewsItemConfirmed(id,idStamp,obj){ 
    alert(obj); 
    $(obj).remove(); 
    return; 
} 

<tr><td onclick=removeNewsItem('111','134234',this)></td></tr> 

Когда я нажимаю на td с помощью removeNewsItem на нем, я не могу передать этот элемент следующим функциям: после того, как пользователь нажимает, на экран выводится сообщение с просьбой подтвердить удаление , но когда они нажимают на него, «это» не проходит должным образом, или более того, я не могу понять, как ...Передавать 'это' от одной функции к другой в javascript?

Может ли кто-нибудь помочь: Как передать объект на другое встроенное событие onclick как выше?

+0

Это не правильное использование методов JQuery , Вы действительно знаете, как программировать на JavaScript? –

+0

Вы забыли кавычки ("), и это не представляет собой строку HTML, а объект dom. Но« это »должно быть правильно передано: http://stackoverflow.com/questions/925734/whats-this-in-javascript -onclick – Julien

+0

Да, что с этим кодом. '$ ('# contentOfBox'). html =' ???. Тогда jquery и 'onclick' ??? Я думаю, вам нужно сначала изучить правильные js, попробуйте более простой пример , а затем вернитесь сюда с правильным кодом. – elclanrs

ответ

0

this относится к элементам с щелчком. Если вы добавите новый элемент со своим собственным обработчиком onclick, то this будет ссылаться на это. Не тот, кто его создал.

Так что это никогда не будет работать так, как вы соберетесь

onclick="removeNewsItemConfirmed(\'' + id + '\',\''+idStamp+'\','+**obj**+')" 

Вместо этого вам нужно создать ссылку, вы можете следить за.

function removeNewsItem(id,idStamp,obj){ 
    $(obj).addClass('markedForDeletion'); 
    $('#whiteCover')show(); 
    $('#contentOfBox').html= ('Are you sure you want ot completely remove this news item?<br/><br/><div style="text-align:center;"><input type="button" class="button blue medium" onclick="removeNewsItemConfirmed()" value="Yes"/> <input type="button" class="button red medium" value="No" onclick="resetContentBox();"/></div>'); 

    $("#whiteCoverContainer").fadeIn(); 
} 

function removeNewsItemConfirmed(){ 
    $('.markedForDeletion').remove(); 
} 

В целом есть много лучших способов справиться со всем этим, но, надеюсь, вам это поможет.

+0

Это тоже место! Я совершенно новичок в jQuery, и для меня это выглядит довольно аккуратно ... – John

1

Кажется, что вы должны использовать события. Если вы используете jQuery, используйте on() для присоединения событий вместо атрибутов. More about on().

Использование этой функции вместо onclick вернет this к вашей функции. В качестве примера:

<table> 
<tr><td>123</td></tr> 
<tr><td>456</td></tr> 
</table> 

и некоторых JS

// Will have access to this and has ev which is the event 
function removeNewsItem(ev){ 
    var $this = $(this); 
} 

$('table').on('click', 'td', removeNewsItem); 

Если вам необходимо приложить значение данных для ваших ячеек таблицы вы можете сделать это с помощью атрибутов данных и jQuery's data().

+0

И это выглядит как можно тише! Мне нужно сделать несколько попыток, чтобы понять все это. Спасибо большое! За все, что вы отвечаете :) – John

1

Ваши события могут выглядеть следующим образом (без изменения слишком много существующей разметки):

$(".newsItem").click(function(){ 
    var id = $(this).attr('id'); 
    var idStamp = $(this).attr('idStamp'); 
    $('#whiteCover')show(); 

    $('#contentOfBox').html= ('Are you sure you want ot completely remove this news item?<br/><br/><div style="text-align:center;"><input type="button" class="button blue medium" onclick="removeNewsItemConfirmed(\'' + id + '\',\''+idStamp+'\')" value="Yes"/> <input type="button" class="button red medium" value="No" onclick="resetContentBox();"/></div>'); 

    $("#whiteCoverContainer").fadeIn(); 
}); 

function removeNewsItemConfirmed(id,idStamp){    
    alert(id);    
    $("#"+id).remove();    
    return;    
}  

Ваш HTML будет выглядеть следующим образом:

<tr><td id='111' idStamp='134234' class='newsItem'></td></tr> 
+0

Большое вам спасибо! Это потрясающе, я никогда не думал добавлять дополнительные атрибуты к . – John

Смежные вопросы