0

我已经有了onclick在鼠标单击时更改 div 边框颜色的事件。

我希望能够在 shift + 单击时单独更改背景颜色，而无需更改边框颜色。

如何做到这一点？

编辑：

多次点击和 shift+click 的当前代码：

<script> 
var linkClick = 1; 
  function update_x(obj){ 
  if (linkClick == 1){obj.style.border = 'solid 1px #eeeeee';};
  if (linkClick == 2){obj.style.border = 'solid 1px red'};
  if (linkClick == 3){obj.style.border = 'solid 1px rgba(50, 255, 50, 1)'};
  if (linkClick == 4){obj.style.border = 'solid 1px rgba(70, 180, 255, 1)'};
  if (linkClick == 5){obj.style.border = 'solid 1px yellow'};
  if (linkClick >5 ) {obj.style.border = 'solid 1px #555555'; linkClick=0};
  linkClick++; 
}
</script>
<script>
function changeDivColor (event) {
    event = event || window.event;
    var myDiv = document.getElementById("b14")
    if (event.shiftKey == true) {
        myDiv.style.backgroundColor = "blue";  
    }
}
window.onload = function () {
    document.getElementById("b14").onclick = function (event) {
        changeDivColor (event);
        update_x(this);
    }
}
</script>

edit2 - 由杰夫曼解决

4

3 回答 3

1

在您的onclick中，请确保您引用了event，例如，如果您使用的是属性：

<div onclick="clickHandler(event);" ... >

或者如果您稍后分配它：

divElement.onclick = function(event) {
    event = event || window.event; // Support for older IE
    // ...
};

或者如果你真的在使用addEventListener并且只是onclick作为一种速记说：

divelement.addEventListener("click", function(event) {
    // ...
}, false);

然后你可以参考event.shiftKey标志来判断 Shift 是否向下。

实例| 直播源

规范中的更多内容。

于 2013-08-04T18:38:08.997 回答
1

最新代码。在这里看到它的工作：http: //jsfiddle.net/jeffman/Y3QET/

var linkClick = 1; 
function update_x(obj) { 
    if (linkClick == 1){obj.style.border = 'solid 1px #eeeeee';};
    if (linkClick == 2){obj.style.border = 'solid 1px red'};
    if (linkClick == 3){obj.style.border = 'solid 1px rgba(50, 255, 50, 1)'};
    if (linkClick == 4){obj.style.border = 'solid 1px rgba(70, 180, 255, 1)'};
    if (linkClick == 5){obj.style.border = 'solid 1px yellow'};
    if (linkClick >5 ) {obj.style.border = 'solid 1px #555555'; linkClick=0};
    linkClick++; 
}

function changeDivColor (el, event) {
    if (event.shiftKey == true) {
        el.style.backgroundColor = "blue";  
    }
}
window.onload = function () {
    var i = 1, len = 5; // len is the number of elements using the b1 id pattern
    for (i; i <= len; i++) {
        document.getElementById("b" + i).onclick = function (event) {
            event = event || window.event;
            changeDivColor (this, event);
            update_x(this); // or whatever your other function is.
        }
    }
}
于 2013-08-04T18:39:39.577 回答
0

Javascript.net 在http://www.javascripter.net/faq/ctrl_alt.htm有一个关于如何做你需要的解释

于 2013-08-04T18:40:12.377 回答