выбор яваскрипта - PullRequest
Новая
       33

выбор яваскрипта

1 голос
/ 01 июля 2010

Я хочу выбрать диапазон ячеек в таблице HTML и с помощью Javascript изменить цвет фона выбранных ячеек. Есть ли событие для получения всех идентификаторов выбранных ячеек?

Я попробовал этот код: 

function getSelectedCells()
{
   selObj = window.getSelection();
   alert(selObj);
}

И это распечатало содержимое ячейки выбранных ячеек. Кто-нибудь знает, как я могу использовать это, чтобы получить идентификатор выбранных ячеек?

Ответы [ 2 ]

0 голосов
/ 02 июля 2010

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

function foo() 
{  
    selecIds = new Array();

    sel = window.getSelection();

    firstPosSelA = sel.anchorNode;
    lastPosSelF = sel.focusNode;

    firstCellId = firstPosSelA.parentNode.getAttribute("id");
    lastCellId = lastPosSelF.parentNode.getAttribute("id");

    startSelNumInd = firstCellId.indexOf("wc");
    endSelNumInd = lastCellId.indexOf("wc");

    startSelNum = firstCellId.substring(startSelNumInd + 2);
    endSelNum = lastCellId.substring(endSelNumInd + 2);
    firstSelecRow = firstCellId.substring(0, startSelNumInd + 2);

    for ( i = startSelNum; i <= endSelNum; i++)
    {
        cellid = firstSelecRow + i;
        selecIds.push(cellid); 
    }

    alert(selecIds);

    for ( eachSelCell in selecIds)
    {
        currentElement = document.getElementById(selecIds[eachSelCell]);
        backColor = currentElement.style.backgroundColor;

        if (backColor !='' || backColor!='#C0C0C0' || backColor!='#c0c0c0' || backColor!='rgb(192, 192, 192)' || backColor!='RGB(192, 192, 192)')
        {
            if (/\d\w/.test(selecIds[eachSelCell]) || (/fc/.test(selecIds[eachSelCell])))
            {
            }   
            else
            {
                changeBackgroundColor(selecIds[eachSelCell]);
            }   
        }
    }
}
0 голосов
/ 02 июля 2010

Я создал тест для решения этой проблемы с помощью jQuery, потому что, честно говоря, это просто делает это проще. Метод, который я использовал, состоял в том, чтобы перебрать возможные элементы и проверить, находятся ли они внутри диапазона. 

function display() {
  if (document.getSelection) {
    var str = document.getSelection();
  } else if (document.selection && document.selection.createRange) {
    var range = document.selection.createRange();
    var str = range;
  } else {
    var str = 0;
  }
  if(str != 0){
  $("td").each(function() {
    var range, sourceRange, compare;
    range = str.getRangeAt(0);
    sourceRange = document.createRange();
    sourceRange.selectNode(this);
    compare = range.compareBoundaryPoints(Range.START_TO_END, sourceRange) * range.compareBoundaryPoints(Range.END_TO_START, sourceRange);
    if (compare == -1){
            alert(this.id);
    }
    /*
    if you really just want to change the background color, uncomment this code:
    */
    /*
    if (compare == -1){
            $(this).css("background", "#f00");// or any other color here.
    }
    */
  });
  );
}

if (window.Event)
  document.captureEvents(Event.MOUSEUP);
document.onmouseup = display;

это, вероятно, не лучшее решение, но оно может заставить нас двигаться в правильном направлении.

...