简体   繁体   中英

jQuery append clarification

I am statically binding the accordion panel like this:

<body>
  <ul class="accordion_menu">
    <li class="has_sub">
      <div class="arrow_trigger up_arrow down_arrow"></div>
      <span>Dropdown</span>
      <ul>
        <li><a href=''>Option 1</a></li>
        <li><a href=''>Option 2</a></li>
      </ul>
    </li>
  </ul>     
</body>

The requirement was to bind the accordion using JSON/XML. The call to JSON Object/XML works fine, but when I append the static element using a jQuery accordion panel, it is not functional.

Partial code is given below:

$('.accordion_menu').append(
   "<li class='has_sub'>"
   + "<div class='arrow_trigger up_arrow down_arrow'>"
   + "</div><span>**JSON DATA GOES HERE**</span>"
   + "<ul>"
   + "<li><a href=''>Option 1</a></li>"
   + "<li><a href=''>Option 2</a></li>"
   + "</ul>"
   + "</li>");

What is the issue with the .append() function?

There is no issue with the .append() function, but since the elements it adds were not present at the time the accordion was instantiated, they don't receive any of the event handlers with which the other accordion elements have been decorated. You'll want to either re-instantiate the accordion after the .append() call, or wait until after .append() to instantiate the accordion.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM