html - Javascript events and strange behaviour after deletion process -
i have table, on each row (the tr
tag) 3 events setted onclick
, onmouseout
, onmouseover
. each row, first 3 td
tag contains onclick
event.
<tr onclick="javascript:getwsdata(...)" onmouseout="this.classname=cltwo" onmouseover="this.classname=clthree"> <td onclick="popdivinfo(false, verricdivcreainfo('details'))"> details </td> <td onclick="popdivinfo(false, verricdivcreainfo('edit'))"> edit </td> <td onclick="if(confirm('are sure?')) {getwsdata('delete');event.stoppropagation(); } else {alert('cancelled!')}"> delete </td> <td>...</td> <td>...</td> <td>...</td> </tr>
as far know: td
's onclick
triggered default event chain should execute first , should execute tr
's onclick
. , ok me. but, in case of deletion (the third td
), don't want event chain goes forward, used event.stoppropagation()
;
the standard behaviour quite correct, got 1 single problem: deletion happens either details either edit td
stop working. first click (after deletion) doesn't working @ best (i'm not completly aware of happening) while deletion still working. when click second time both td's onclick (details & edit) newly completly working.
few more things:
- the behaviour correct before deletion
- every deletion action delete
tr
using jqueryremove
method (nothing happens if comment instruction) - when issue happens, happens on entire columns (details , edit)
- the issue doesn't happen if don't confirm deletion process
- the
tr
's onclick working - the first click (after deletion) on details or edit indeed partially start javascript action (cause preloading launched) action not completed.
- even if td action not completed,
tr
action executed, there aren't unusefullstoppropagation()
any ideas? have no ideas @ all.
as remember tr
virtual markup unit. group elements tbody
example. doesn't take part in event bubbling @ all. shouldn't bind events on it. can see in example: http://jsfiddle.net/z9vvm/. here see event binded tr
element has target td
anyway, not tr
desired. binding event tr
same give td
in row class , bind event classes – tr
way group elements. why stoppropagation
doesn't work. there no propagation @ all.
the way can work around – manipulating classes. take @ example: http://jsfiddle.net/rzscw/1/
Comments
Post a Comment