Question

我有这个JavaScript功能，在点击每个TD时突出显示表TD

<script type="text/javascript">
    window.onload = function(){
    var all = document.getElementsByClassName("clicker");
    for (var i=0;i<all.length;i++) {
        all[i].onclick = inputClickHandler;       
    }
};

function inputClickHandler(e){
    e = e||window.event;
    var tdElm = e.target||e.srcElement;
    if(tdElm.style.backgroundColor == 'rgb(0, 153, 0)'){
        tdElm.style.backgroundColor = '#fff';
    } else {
        tdElm.style.backgroundColor = '#009900';
    }
}
    </script>

我有一张8比8的表，它们都是方形的。在表格上方，我有一个带有选择菜单的表单，如下所示。

<form id="filter">
<select id="highlights" name="highlights">
<option value="0"> Select... </option>
<option value="20"> 20 </option>
<option value="24"> 24 </option>
<option value="28"> 28 </option>
<option value="30"> 30 </option>
</select>

基本上我想要的是让用户从高光表单中选择一个选项，所以说我选择“24”，它只允许我在表格中突出显示“24”方块。如果我从“24”更改为“28”，则允许突出显示“28”并且不会超过所选内容。我该怎么做？

Answer 1

做这样的事情：

var max = 0, highlighted = 0
document.getElementById('highlights').onchange = function () {
  max = this.value
}
...
function inputClickHandler(e){
  e = e||window.event;
  var tdElm = e.target||e.srcElement;
  if(tdElm.style.backgroundColor == 'rgb(0, 153, 0)'){
    highlighted--
    tdElm.style.backgroundColor = '#fff';
  } else if (highlighted != max) {
    highlighted++
    tdElm.style.backgroundColor = '#009900';
  }
}

如何限制javascript突出显示功能的使用次数？

1 个答案: