Quantcast
Channel: Active questions tagged javascript - Stack Overflow
Viewing all articles
Browse latest Browse all 140817

jQuery .load() function stripping out tags from WordPress posts

$
0
0

I am having issues displaying images in a HTML div that loads dynamically using jQuery .load(). The jQuery function I am currently using is included below:

jQuery(document).ready(function(e) {
    // Past sendout nav trigger function
    e( ".btn--nav-trigger" ).click(function() {
        e( this ).toggleClass( "btn--nav-trigger-active" );
        e( ".sendout__list" ).toggleClass( "sendout__list--open" );
    });

    // AJAX .load function for sendout post content
    e( ".sendout-link" ).click(function() {     
        e( ".btn--nav-trigger" ).toggleClass( "btn--nav-trigger-active" );
        e( ".sendout__list" ).toggleClass( "sendout__list--open" );
        var post_url = e( this ).attr( "href" );
        e( "#sendout-container" ).html( '<div class="loading"></div>' );
        e( "#sendout-container" ).load( post_url, function( response, status, xhr ) {
            if ( status == "error" ) {
                var msg = "Sorry but there was an error: ";
                e( "#sendout-container" ).html( msg + xhr.status + "" + xhr.statusText );
            }
        });
        return false;
    });
});

The function successfully loads the text and YouTube iframe from the selected WordPress post, but it always strips the images.

The href attribute from the function is using <?php the_permalink(); ?> from WordPress. The individual posts load correctly, but something with the .load() function is stripping out the full <img> tags.

Update

It looks like the entire div that contains the image is being stripped as well. Not sure why this is happening. I have included the WordPress HTML/PHP code that is being fully stripped when using the .load() function below. This code is displayed correctly using WordPress/PHP.

<?php if(get_field( 'meme_one_image' )): ?>
<div class="sendout__row sendout--meme">
    <?php 
    $memeOneImage = get_field( 'meme_one_image' );
    if( !empty($memeOneImage) ): ?>
        <img src="<?php echo $memeOneImage['url']; ?>" alt="<?php echo $memeOneImage['alt']; ?>" />
        <div class="sendout--meme_share">
            <h4>Share this meme</h4>
            <a href="http://www.facebook.com/sharer/sharer.php?u=<?php echo $memeOneImage['url']; ?>" class="button">Facebook</a>
            <a href="http://twitter.com/intent/tweet?text=<?php echo $memeOneImage['title'] .' : '. $memeOneImage['url']; ?>" class="button">Twitter</a>
            <button class="button copy-button" data-clipboard-text="<?php echo $memeOneImage['url']; ?>">Copy URL</button>
        </div>
    <?php endif; ?>
</div>
<?php endif; ?>

Viewing all articles
Browse latest Browse all 140817

Latest Images

Trending Articles



Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>