Question

好的，我正在编写一个脚本，将热键添加到我玩的宠物网站上的探索页面...我已设法将焦点设置为按键上的所需链接，甚至更改背景颜色选择它时的选择...

var theLinks=theTable.getElementsByTagName('a')

var theCells=theTable.getElementsByTagName('td')

if (theLinks.length==0){
  theTable =document.getElementById('right').getElementsByTagName('table')[1];
  theLinks=theTable.getElementsByTagName('a')
  theCells=theTable.getElementsByTagName('td')
}

window.onkeydown = function(event) {
  if (event.keyCode === 49) {
    theLinks[0].focus()
    theCells[0].style.color = "#f00"; 
    theCells[0].style.backgroundColor="#fcc";
  }

  if (event.keyCode === 50) {
    theLinks[1].focus()
    theCells[1].style.color = "#f00"; 
    theCells[1].style.backgroundColor="#fcc";
  }

  if (event.keyCode === 51) {
    theLinks[2].focus()
    theCells[2].style.color = "#f00"; 
    theCells[2].style.backgroundColor="#fcc";
  }
};

现在，当链接失去焦点时，如何让颜色恢复正常？我试过这个：

if (event.keyCode === 49) {
  theLinks[0].focus()
    if (theLinks[0].hasFocus()){
      theCells[0].style.color = "#f00"; 
      theCells[0].style.backgroundColor="#fcc";
   }
}

但是它不起作用，我不知道我在这里做了什么 - 所以如果你点击别的东西我如何让突出显示消失？

Answer 1

使用 onblur 事件。当您专注于另一个元素时，会自动为聚焦元素触发。

http://www.w3schools.com/jsref/event_onblur.asp

编辑：或使用：focus 伪选择器

a:focus { 
  color: '#f00'; 
  background-color: '#fcc';  
}

http://www.w3schools.com/cssref/sel_focus.asp

Greasemonkey - 如果只有焦点时如何突出显示内容？

1 个答案: