HTML Escaping/Encoding in Javascript/PHP

Question

I have multiple pages of html code saved into a database. I want a file to be able to flip through each of these pages without reloading.

I created a PHP file to pull all the pages into a database.

The page shows the first page and navigation buttons.

There is also javascript to put all the other pages into an array so I can quickly switch pages.

var pages = new Array();
<?php foreach ($coursePages as $page): ?>
    pages[pageCount] = "<?php echo ($page['body']) ?>";
    pageCount++;
<?php endforeach ?>

My problem is creating the javascript array. How can I escape the data from the echo properly so it can eventually change the page content using the following:

$(document).ready(function() {
    $('.navNext, .navPrevious').click(function({
        if ($(this).hasClass('navNext')) {
            page++;
            if (page > pageCount) {
                page = 0;
            }
        } else {
            page--;
            if (page < 0) {
                page = 0;
            }
        }

        $('.page').html(pages[page]);
    }))
});

May be it's better to render this pages to <div id="page1" class="pages hidden"> content </div> and than just switch divs visibiblity? $('.pages').hide();$('#page'+uid).show(); ? — BaBL86
– BaBL86, Commented Dec 11, 2013 at 19:32

kendsnyder · Accepted Answer · 2013-12-11 19:52:25Z

1

Anytime you send values dynamically from PHP to JavaScript, you can simply use json_encode(). It will always produce valid JavaScript and handle all data types. Example:

<script>
    var a = <?php echo json_encode($var)?>;
</script>

answered Dec 11, 2013 at 19:52

kendsnyder

7937 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sean Over a year ago

This was kind of where I was going but for some reason it didn't seem to work properly. I tried it again and now it is.

Iłya Bursov · Accepted Answer · 2013-12-11 19:44:00Z

1

you can use this function to escape js values:

function js_escape_string($str)
{
    $str = str_replace("\\", "\\\\", strval($str));
    $str = str_replace("'", "\\'", $str);
    $str = str_replace("\r", "\\r", $str);
    $str = str_replace("\n", "\\n", $str);
    $str = str_replace("\t", "\\t", $str);
    $str = str_replace("</script>", "</'+'script>", $str);
    return $str;
}

NOTE: use single quote ' around JS values, like:

<script>
var a = '<?php echo js_escape_string(....); ?>';
</script>

answered Dec 11, 2013 at 19:44

Iłya Bursov

24.4k4 gold badges36 silver badges68 bronze badges

Collectives™ on Stack Overflow

HTML Escaping/Encoding in Javascript/PHP

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related