運行javascript函數時收到NaN錯誤

Question

我有一個頁面使用發送數據（在下面的例子中，數字2）從div到javascript函數，但它似乎沒有正常工作。 警報出現如圖所示。 有任何想法嗎？

DIV LINE

<div id="containerbar" data-F1="2" style="min-width: 200; height: 400px; margin: 0 auto"></div>

JAVASCRIPT

<script>

$(function () {

var $bardata = $("#containerbar");
var valueF1 = parseInt($bardata.data('F1'));

alert("Val1: " + valueF1);

$bardata.highcharts({
        chart: {
            type: 'bar'
        },
        title: {
            text: 'Teacher count per slider'
        },
        xAxis: {
            categories: ['Feedback', 'Challenge & differentiation', 'Classroom talk', 'Skills development', 'Expectations & relationships'],
            title: {
                text: null
            }
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Count',
                align: 'high'
            },
            labels: {
                overflow: 'justify'
            }
        },
        tooltip: {
            valueSuffix: ' xx'
        },
        plotOptions: {
            bar: {
                dataLabels: {
                    enabled: true
                }
            }
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            x: -40,
            y: 100,
            floating: true,
            borderWidth: 1,
            backgroundColor: '#FFFFFF',
            shadow: true
        },
        credits: {
            enabled: false
        },
        series: [{
            name: '1st quartile',
            data: [valueF1 , 4, 1, 0, 0]
        }, {
            name: '2nd quartile',
            data: [4, 4, 1, 0, 0]
        },{
            name: '3rd quartile',
            data: [4, 4, 1, 0, 0]
        }, {
            name: '4th quartile',
            data: [4, 4, 1, 0, 0]
        }]
    });
});

</script>

Answer 1

var valueF1 = parseInt($bardata.attr('data-F1'));