jquery - jquery mobile gridview的onclick事件

Question

我使用 jquery 的默认 GridView 设计了一个图表，以提高速度和时间。我想从表中获取车辆的速度。

这是设计

<div data-role="page" id="home">
        <div data-role="header">
            <h1>Home Screen</h1>
        </div>
        <div data-role="content">
            <div class="ui-grid-d" id="SpeedLevel">
                <div class="ui-block-a"
                    style="border: 1px solid black; border-bottom:none; text-align: center; height:100px;width:5%;">
                    <p></p>
                </div>

                <div class="ui-block-b"
                    style="border: 1px solid black; text-align: center; height:100px; width:5%;">
                    <p>super fast</p>
                </div>
                <div class="ui-block-c"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S1</span>
                </div>
                <div class="ui-block-d"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S2</span>
                </div>
                <div class="ui-block-e"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S3</span>
                </div>
                <div class="ui-block-a rotate"
                    style="border: 1px solid black; border-bottom:none; border-top:none; text-align: center; height:100px;width:5%;">
                    <p>Speed</p>
                </div>
                <div class="ui-block-b"
                    style="border: 1px solid black; text-align: center; height:100px;width:5%;">
                    <p>Faster</p>
                </div>
                <div class="ui-block-c"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S4</span>
                </div>
                <div class="ui-block-d"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S5</span>
                </div>
                <div class="ui-block-e"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S6</span>
                </div>
                <div class="ui-block-a"
                    style="border: 1px solid black;border-top:none; text-align: center; height:100px;width:5%;">
                    <p></p>
                </div>
                <div class="ui-block-b"
                    style="border: 1px solid black; text-align: center; height:100px;width:5%;">
                    <p>Fast</p>
                </div>
                <div class="ui-block-c"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S7</span>
                </div>
                <div class="ui-block-d"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S8</span>
                </div>
                <div class="ui-block-e"
                    style="border: 1px solid black; text-align: center; height:100px;width:30%;">
                    <span>S9</span>
                </div>
            </div>
            <div class="ui-grid-solo" style="border: 1px solid black; text-align:center; height:30px;">
                <span>Time</span>
            </div>
        </div>
    </div> 

这是我尝试过的onclick，我能够点击所有单元格并获取数据。

$(document).on('pageshow', '#home', function() {
    alert("in page");
    $('#SpeedLevel>div').on('click', function(e) {
        e.preventDefault();
//      alert("sdfa");
        alert($(this).text());
    });
});

现在我只需要使S1，S2，S3，S4，S5，S6，S7，S8，S9单元格可点击，当我点击这些单元格时我需要获取相应的值..

我该怎么做？

提前致谢:):)

Answer 1

下面的几行对我来说很有效。

$(document).on('pageshow', '#home', function() {
    alert("in page");
    $('#SpeedLevel>.ui-block-c,.ui-block-d,.ui-block-e').on('click', function(e) {
        e.preventDefault();
        alert($(this).text());
    });
});