Friday, October 14, 2022
HomeWordPress Developmentphp - Totally different behaviour between "include_once" and straight echoing out html...

php – Totally different behaviour between “include_once” and straight echoing out html code?


I am afraid the query is expounded to my (nonetheless) restricted PHP and JS competence.
Throughout some workout routines (for one thing that shall develop into ultimately a WordPress plugin) I got here throughout the next conduct that I cannot clarify!

To attract a menu I hooked a way referred to as display_menu() to the wp_nav_menu_items filter.
Right here is the tactic:

 public perform display_menu( $objects, $args ) {
    include_once <path>/partials-off-canvas.php';
    }

In partials-off-canvas.php we solely have

<div class="menu">
    <p>Menue Entry 1</p>
    <p>Menue Entry 2</p>
    <p>Menue Entry 3</p>
</div>
<div class="menu_toggle_icon">
    <span></span>
</div>

With some JS (and CSS) it really works as a menue toggle button that opens a menu.

(perform( $ ) {
    'use strict';

        $(perform() {
            const toggle_icon = doc.querySelector('.menu_toggle_icon');
            const menu    = doc.querySelector('.menu');
            
            /*
             * Toggles on and off the 'lively' class on the menu
             * and the toggle button.
             */
            toggle_icon.addEventListener('click on', () => {
              toggle_icon.classList.toggle('lively');
              menu.classList.toggle('lively');
            })
        });
    
    })( jQuery );

To this point so good.
For coaching causes I modified the display_menu() methodology a bit:

public perform display_menu( $objects, $args ) {
    echo '
    <div class="menu">
        <p>Menue Entry 1</p>
        <p>Menue Entry 2</p>
        <p>Menue Entry 3</p>
    </div>
    <div class="menu_toggle_icon">
    <span></span>
    </div>';
    }

Truly I anticipated the very same consequence as earlier than.
However that is not precisely the case.
Although the visible consequence within the front-end is identical (I can see the menu toggle icon) it appears now not be tied to the JS ‘click on’ occasion.
If I click on on the icon nothing occurs.

Now I am curious what I have never perceive and what are the variations between each variations of display_menu()?

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments