Question

我有一张simle表

<table cellpadding="0" cellspacing="1" id="our_table">
                            <thead style="background-color: #393a44;">
                                <tr>
                                    <th></th>
                                    <th>PON</th>
                                    <th>UTO</th>
                                    <th>SRI</th>
                                    <th>ČET</th>
                                    <th>PET</th>
                                    <th>SUB</th>
                                    <th>NED</th>
                                </tr>



                            </thead>


                            @for (float i = 00; i <= 23; i++)
                            { 
                            <tr>
                                <td>@i</td>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            }
                        </table>

在列标题中，我得到weeek的日子，在第一行我有时间。当我点击鼠标并选择它们时，我有这个jquery突出显示单元格。这是有效的，我需要的是获取表中所有选定单元格的标题文本和行文本。

https://jsfiddle.net/sakonja/cvrcgyph/1/

我有我所拥有的jsfiddle例子。我可以选择多行，高亮显示它们。在单元格上单击我获取标题文本和行文本我需要的是从所有选定的单元格中获取数据：）

Answer 1

这是您更新的脚本。查看警报和控制台。

 $(function () {
        var isMouseDown = false;
        $("#our_table td")
          .mousedown(function () {
              isMouseDown = true;
              $(this).toggleClass("highlighted");
              return false; // prevent text selection
          })
          .mouseover(function () {
              if (isMouseDown) {
                  $(this).toggleClass("highlighted");
              }

          })
          .bind("selectstart", function () {
              return false; // prevent text selection in IE
          });

        $(document)
          .mouseup(function () {
              isMouseDown = false;




          });
    });

var selectedArray = [];
    $('#our_table').on('click', 'td', function (e) {
        var time = e.delegateTarget.tHead.rows[0].cells[this.cellIndex],
            day = this.parentNode.cells[0];
        if($.inArray($(day).text() +","+$(time).text(), selectedArray )!==-1 ) {
            selectedArray = jQuery.grep(selectedArray, function(value) {
              return value != $(day).text() +","+$(time).text();
            });
        } else {
           selectedArray.push( $(day).text() +","+$(time).text() ); 
        }
        console.log(selectedArray);
        alert(selectedArray.toString());
    })

    $(function () {
        $("#accordion").accordion({
            collapsible: true
        });
    });

Jquery获取表中所有选定单元格的列标题和行标题

1 个答案: