HTML5 sessionStorage：变量未存储在 <li> onclick属性

Question

i wonder why this onclick work on this div:

<div id="block-block-contact" class="block-factice expanded" onclick="sessionStorage.contactclass=this.className ">

but not on this li

 <li id="dhtml_menu-1895" class="first collapsed dhtml-menu collapsed start-collapsed menu-1895" onclick="sessionStorage.menu1895=this.className">

meaning when i click on the div, it does store the contactclass variable whereas when i click on the li, it does not store the menu1895 variable

Answer 1

Matoeil,

Can you please check this https://jsfiddle.net/612ee2df/

 <ul>
  <li id="dhtml_menu-1895" class="first collapsed dhtml-menu collapsed    start-collapsed menu-1895" onclick="sessionStorage.menu1895=this.className">
   Test
  </li>
</ul>

jQuery

$(document).ready(function(e)
{
  $('ul li').on('click',function(e)
  {
      var cls = $(this).attr('class');
      alert(cls);
      sessionStorage.menu1895 = cls;
  })
 })

Because I tried your code-snippet but instead of JavaScript I used jQuery & it saved the value in session storage.

Answer 2

another event was linked to this element. To strip all event listeners i did

var old_element=document.getElementById("dhtml_menu-1895");     
var new_element = old_element.cloneNode(true);
old_element.parentNode.replaceChild(new_element, old_element);  

and now it works