Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Выделение копирование элементов table (https://javascript.ru/forum/misc/23405-vydelenie-kopirovanie-ehlementov-table.html)

Девелапер 22.11.2011 14:53

Выделение копирование элементов table
 
Доброго времени суток. Хотел бы узнать как сделать возможность выделения и копирования содержимого таблицы, что бы работало во всех браузерах подобно firefox(когда при зажатие Shift или Ctrl выделяешь сколько угодно полей и спокойно копируешь их)

Если есть какие идей, помогите кто чем может:)

Skipp 22.11.2011 15:37

Это не так просто, как вам кажется

Девелапер 22.11.2011 16:04

Спасибо Skipp, я и сам знаю что это не прото)
Я наверное не с того начал. Я написал скрипт для выделения по средсвам движения мыши, я могу извлечь выделенные элементы , но мне их извлекать не надо, а надо чтобы была возможность их копирования.
Код:

<style type="text/css">

                        html, body{

                                margin:        0px;

                        }

                        table{

                                -moz-user-select:        none;

                                -khtml-user-select:        none;

                                user-select:                none;

                                width:                        500px;

                                height:                        500px;

                        }

                        table, td, th{

                                margin:        10px;

                                border-style:        solid;

                                border-color:        black;

                                border-width:        1px;

                        }

                </style>

<script type="text/javascript">
    var startCell = null;
 
    function mouseDown(table, e) {
        if (!e) var e = window.event;

        startCell = e.srcElement ? e.srcElement : e.target;
        if (startCell.tagName != "TD") {
            startCell = null;
            return;
        }
        mouseMove(table, e);
    }
 
    function mouseUp(table, e) {
        if (!e) var e = window.event;

        var endCell = e.srcElement ? e.srcElement : e.target;
        if (!(endCell.tagName == "TD" && startCell))
            return false;

        var from = getCellPos(table, startCell);
        var to = getCellPos(table, endCell);
        if (!from || !to)
            return false;

 
        startCell = null;
        // вот здесь я извлекаю выделенные элементы
        var table2 = document.getElementById('idWalkTable');
        var trList = table2.getElementsByTagName('tr');
        var result = "";
        for (var i = from.row; i <= to.row; i++) {
            var tdList = trList[i].getElementsByTagName('td');

            for (j = from.col; j <= to.col; j++) {
                result += tdList[j].innerHTML;
            }
            result += '\n';
        }
        alert(result);

    }
   
 
 
    function mouseMove(table, e) {
        if (!e) var e = window.event;

        var endCell = e.srcElement ? e.srcElement : e.target;
        if (!(endCell.tagName == "TD" && startCell))
            return false;

        var from = getCellPos(table, startCell);
        var to = getCellPos(table, endCell);
        if (!from || !to)
            return false;

 
        var x, y, cells;
        for (y = 0; y < table.rows.length; y++) {
            row = table.rows.item(y);
            for (x = 0; x < row.cells.length; x++) {
                if ((from.row - y) * (y - to.row) >= 0 && (from.col - x) * (x - to.col) >= 0)
                    row.cells.item(x).style.backgroundColor = "#ffdddd";
                else
                    row.cells.item(x).style.backgroundColor = "transparent";
            }
        }
    }

    function getCellPos(table, cell) {
        var pos = new Object();
        if (cell.nodeName == "TD") {
            var x, y, cells;
            for (y = 0; y < table.rows.length; y++) {
                row = table.rows.item(y);
                for (x = 0; x < row.cells.length; x++) {
                    if (row.cells.item(x) == cell) {
                        pos.row = y;
                        pos.col = x;
                        return pos;
                    }
                }
            }
        }
        return null;
    }

                </script>
<script type="text/javascript">
    try {
        var pageTracker = _gat._getTracker("UA-9296140-1");
        pageTracker._trackPageview();
    } catch (err) { }
</script>
<body>


<table id="idWalkTable" onmousedown="mouseDown(this, event); return false;" onmouseup="mouseUp(this, event);" onmousemove="mouseMove(this, event); return false;">
<tr>
<td>(0,0)</td><td>(1,0)</td><td>(2,0)</td><td>(3,0)</td><td>(4,0)</td><td>(5,0)</td><td>(6,0)</td>
</tr>
<tr>
<td>(0,1)</td><td>(1,1)</td><td>(2,1)</td><td>(3,1)</td><td>(4,1)</td><td>(5,1)</td><td>(6,1)</td>
</tr>
<tr>
<td>(0,2)</td><td>(1,2)</td><td>(2,2)</td><td>(3,2)</td><td>(4,2)</td><td>(5,2)</td><td>(6,2)</td>
</tr>
<tr>
<td>(0,3)</td><td>(1,3)</td><td>(2,3)</td><td>(3,3)</td><td>(4,3)</td><td>(5,3)</td><td>(6,3)</td>
</tr>
<tr>
<td>(0,4)</td><td>(1,4)</td><td>(2,4)</td><td>(3,4)</td><td>(4,4)</td><td>(5,4)</td><td>(6,4)</td>
</tr>
<tr>
<td>(0,5)</td><td>(1,5)</td><td>(2,5)</td><td>(3,5)</td><td>(4,5)</td><td>(5,5)</td><td>(6,5)</td>
</tr>
<tr>
<td>(0,6)</td><td>(1,6)</td><td>(2,6)</td><td>(3,6)</td><td>(4,6)</td><td>(5,6)</td><td>(6,6)</td>
</tr>
</table>

<textarea id="forе" name="fore" onfocus="this.select()"> 1234567890</textarea>

</body>


Девелапер 23.11.2011 09:18

в общем мне нужно чтобы полученная строка result при нажатие на сочетание клавиш ctrl+c попадало в буфер, как при простом копирование текста. с выделение я справился(выделяется и через ctrl). Есть какие идеи? буду рад любой помощи.

Skipp 23.11.2011 09:34

Вот так сразу и надо начинать:)
Обычно это решается через flash, так как у js нету доступа к буферу.
Так что копайте в сторону flash.

Девелапер 23.11.2011 10:18

спасибо за помощь:)

Skipp 23.11.2011 10:35

Если было бы за что


Часовой пояс GMT +3, время: 13:24.