代码之家  ›  专栏  ›  技术社区  ›  Chris Burgess

JavaScript无法说服鼠标改变光标

  •  2
  • Chris Burgess  · 技术社区  · 14 年前

    我有一个ASP.NET页面上有一个Infrastics webgrid。我在Javascript中通过几个方法处理网格行上的mouseover、mouseout事件,将鼠标光标更改为指针,并在鼠标移到行上时返回默认值。我还切换鼠标悬停行的颜色。

    当我在debug local中运行该页时,它工作正常。当我发布到测试服务器,并在Iexplore(8)中的VS外部运行它时,鼠标光标不会改变。它一直是箭。不过,该行可以正确切换背景色。

    我认为这是一个缓存问题,但是当我在方法中添加一个警报框来显示文档.正文.样式.cursor,它正确地显示警报中的光标状态;它只是不更改鼠标光标。我已经清除了浏览器中的缓存,删除并重新发布,将GUID querystring添加到javascript文件链接中,等等。

     function _projGrid_MouseOverHandler(gridName, id, objectType) {
    
        if (objectType == 0) {
            document.body.style.cursor = 'pointer';
           // alert('mouse pointer should be: ' + document.body.style.cursor);
            var cell = igtbl_getCellById(id);
            var elem = cell.Element;
            setRowBackColor(cell.Row, "F0E68C");
        }
    }
    
    function _projGrid_MouseOutHandler(gridName, id, objectType) {
        if (objectType == 0) {
            document.body.style.cursor = 'default';
           // alert('mouse pointer should be: ' + document.body.style.cursor);
            var cell = igtbl_getCellById(id);
            setRowBackColor(cell.Row, "white");
        }
    }
    
    function setRowBackColor(row, color) {
        var cells = row.getCellElements();
        for (var i = 0; i < cells.length; i++) {
            cells[i].style.backgroundColor = color;
        }
    

    任何想法都欢迎!

    更新:我也有类似的问题 problems 使用CSS

    3 回复  |  直到 7 年前
        1
  •  1
  •   Community Reversed Engineer    7 年前

    找到了答案 here

    但是,当它在Intranet上呈现时,它将使用兼容模式。

    只需将此添加到标题中,即可强制IE进入标准兼容模式:

    <meta http-equiv="X-UA-Compatible" content="IE=edge" />"
    
        2
  •  0
  •   epascarello    14 年前

    您应该将光标设置在单元格级别,而不是文档级别。

    当您可以在CSS文件中为所讨论的tds设置光标时,不知道为什么要首先用JavaScript设置光标。

        3
  •  0
  •   Nelson Rothermel    14 年前

    使用CSS:

    .grid .row:hover {
      cursor: pointer;
      background-color: #F0E68C;
    }
    

    或者

    .grid tr:hover {
       /* ... */
    }
    

    如果没有必要的类,可以尝试使用类似jQuery的方法设置它们: $("selector").addClass("row"); 你也可以 filter() 使用自定义函数或在必要时单独处理每个部分:

    $(".grid").each(function() {
      $(this).find("tr > td").each(function() {
        $(this).addClass("cell");
      });
    });
    

    请注意,以上示例仅用于说明目的。