spread.options.enableAccessibility = true;

<script>
        $(document).ready(function () {
            // initializing Spread
            var spread = new GC.Spread.Sheets.Workbook(document.getElementById('ss'), { sheetCount: 2 });
            // Get the activesheet
            var sheet = spread.getSheet(0);
            //enable accessibility
            spread.options.enableAccessibility = true;
            spread.suspendPaint();
            //set focus
            spread.focus();
            //change the commands related to Tab key, Shift key with Tab key
            var commands = spread.commandManager();
            //TAB
            commands.register("moveToNextCellThenControl", GC.Spread.Sheets.Commands.moveToNextCellThenControl, GC.Spread.Commands.Key.tab, false, false, false, false);
            //SHIFT+TAB
            commands.register("moveToPreviousCellThenControl", GC.Spread.Sheets.Commands.moveToPreviousCellThenControl, GC.Spread.Commands.Key.tab, false, true, false, false);
            //set default row height and column width
            sheet.defaults.rowHeight = 50;
            sheet.defaults.colWidth = 150;
            //set default horizontal alignment and vertical alignment
            var defaultStyle = sheet.getDefaultStyle();
            defaultStyle.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
            defaultStyle.vAlign = GC.Spread.Sheets.VerticalAlign.center;
            defaultStyle.rowHeight = 50;
            defaultStyle.colWidth = 150;
            sheet.setDefaultStyle(defaultStyle);
            //bind data source
            sheet.setDataSource(dataSource);
            // get another sheet 1
            var sheet = spread.getSheet(1);
            //prepare data for chart
            sheet.setValue(0, 1, "Q1");
            sheet.setValue(0, 2, "Q2");
            sheet.setValue(0, 3, "Q3");
            sheet.setValue(1, 0, "Mobile Phones");
            sheet.setValue(2, 0, "Laptops");
            sheet.setValue(3, 0, "Tablets");
            for (var r = 1; r <= 3; r++) {
                for (var c = 1; c <= 3; c++) {
                    sheet.setValue(r, c, parseInt(Math.random() * 100));
                }
            }
            //add columnClustered chart
            var c1 = chart_columnClustered = sheet.charts.add('chart_columnClustered', GC.Spread.Sheets.Charts.ChartType.columnClustered, 50, 300, 300, 300, "A1:D4");
            c1.alt("This is a column chart");
            var chartArea = c1.chartArea();
            chartArea.border.color = "rgba(20, 119, 167, 1)";
            chartArea.border.width = 2;
            c1.chartArea(chartArea);
            // add mango picture
            var p1 = sheet.pictures.add("p1", "mango.jpg", 500, 50, 200, 200);
            p1.alt("This is a mango image");
            p1.borderColor("rgba(20, 119, 167, 1)");
            p1.borderWidth(2);
            p1.borderStyle("solid");
            // add cloud shape
            var sp1 = sheet.shapes.add("sp1", GC.Spread.Sheets.Shapes.AutoShapeType.cloud, 250, 50, 200, 200);
            sp1.alt("This is a cloud shape");
            spread.resumePaint();
            //bind events to set alternative text
            function setAltText(collection, altText) {
                var success = false;
                collection.forEach(function (obj) {
                    if (obj.isSelected()) {
                        obj.alt(altText);
                        success = true;
                    }
                });
                return success;
            }
            var alternativeText = document.getElementById("alternativeText");
            document.getElementById("setAlternativeText").addEventListener("click", function () {
                var altText = alternativeText.value;
                var success = setAltText(sheet.pictures.all(), altText);
                if (success) {
                    return;
                }
                success = setAltText(sheet.charts.all(), altText);
                if (success) {
                    return;
                }
                setAltText(sheet.shapes.all(), altText);
            });
            spread.bind(GC.Spread.Sheets.Events.PictureChanged, function (event, args) {
                if (args.propertyName === "isSelected" && args.picture.isSelected()) {
                    alternativeText.value = args.picture.alt();
                }
            });
            spread.bind(GC.Spread.Sheets.Events.FloatingObjectChanged, function (event, args) {
                var floatingObject = args.floatingObject;
                if (floatingObject && floatingObject instanceof GC.Spread.Sheets.Charts.Chart) {
                    if (args.propertyName === "isSelected" && floatingObject.isSelected()) {
                        alternativeText.value = floatingObject.alt();
                    }
                }
            });
            spread.bind(GC.Spread.Sheets.Events.ShapeChanged, function (event, args) {
                if (args.propertyName === "isSelected" && args.shape.isSelected()) {
                    alternativeText.value = args.shape.alt();
                }
            });
        });
    </script>