jQuery在Safari中呈现，但不在Chrome中呈现

Question

I am using the following code, it renders perfectly in Safari but not in Chrome. I am seeing no errors in the console in Chrome.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>



<!--http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/ -->


<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

<script type="text/javascript">
$(document).ready(function () {
    console.log('inside function');
    $('#container').highcharts({
        title: {
            text: 'Monthly Active Users',
            x: -20 //center
        },
        subtitle: {
            text: 'Users who visited on more than 2 days in the last 30 days',
            x: -20
        },
        xAxis: {
            categories: ["11/09/2016","12/09/2016","13/09/2016","14/09/2016","15/09/2016","16/09/2016","17/09/2016","18/09/2016","19/09/2016","20/09/2016","21/09/2016","22/09/2016",] //insert date here
        },
        yAxis: {
            title: {
                text: 'Percent (%)'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            valueSuffix: '%'
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: [{
            name: 'Monthly Active Users',
            data: [
            4.2359074617139,4.3266102797658,4.3492372606297,4.3000323310702,4.297253634895,4.1612903225806,4.1867954911433,4.3338683788122,4.3089690392595,4.3795620437956,4.3037974683544,4.294284812125,]
        }]
    });
});
</script>

Answer 1

Here's a perfectly fine working snippet

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="https://code.highcharts.com/highcharts.js"></script> <script src="https://code.highcharts.com/modules/exporting.js"></script> <!--http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/ --> <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> <script type="text/javascript"> $(document).ready(function () { console.log('inside function'); $('#container').highcharts({ title: { text: 'Monthly Active Users', x: -20 //center }, subtitle: { text: 'Users who visited on more than 2 days in the last 30 days', x: -20 }, xAxis: { categories: ["11/09/2016","12/09/2016","13/09/2016","14/09/2016","15/09/2016","16/09/2016","17/09/2016","18/09/2016","19/09/2016","20/09/2016","21/09/2016","22/09/2016",] //insert date here }, yAxis: { title: { text: 'Percent (%)' }, plotLines: [{ value: 0, width: 1, color: '#808080' }] }, tooltip: { valueSuffix: '%' }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'middle', borderWidth: 0 }, series: [{ name: 'Monthly Active Users', data: [ 4.2359074617139,4.3266102797658,4.3492372606297,4.3000323310702,4.297253634895,4.1612903225806,4.1867954911433,4.3338683788122,4.3089690392595,4.3795620437956,4.3037974683544,4.294284812125,] }] }); }); </script> 

with your code that works on Chrome. Could you maybe provide more details about how you're running this and if there are any warnings in the console (not errors)

Answer 2

I have just run the code in chrome and it renders just fine. I am using chrome version Version 52.0.2743.116 m.