使用不引人注目的Javascript按ID操纵多个复选框？_Javascript_Dom Events_Unobtrusive Javascript

使用不引人注目的Javascript按ID操纵多个复选框？

javascript

使用不引人注目的Javascript按ID操纵多个复选框？,javascript,dom-events,unobtrusive-javascript,Javascript,Dom Events,Unobtrusive Javascript,我希望能够在MouseOver上选择多个复选框，但是我没有将onmouseover应用于每个单独的复选框，而是尝试通过按ID操作复选框来解决这一问题，尽管我不确定从使用getElementById到何处。因此，与您在下面看到的不同： <html> <head> <script> var Toggle = true; var Highlight=false; function handleKeyPress(evt) { var nb

我希望能够在MouseOver上选择多个复选框，但是我没有将onmouseover应用于每个单独的复选框，而是尝试通过按ID操作复选框来解决这一问题，尽管我不确定从使用getElementById到何处。因此，与您在下面看到的不同：

<html>
<head>
<script>
     var Toggle = true;

  var Highlight=false;
  function handleKeyPress(evt) {
     var nbr;
     if (window.Event) nbr = evt.which;
     else nbr = event.keyCode;
     if(nbr==16)Highlight=true;
     return true;
  }

  function MakeFalse(){Highlight=false;}

  function SelectIt(X){
      if(X.checked && Toggle)X.checked=false;
      else X.checked=true;
  }
function ChangeText()
{
    var test1 = document.getElementById("1");
    test1.innerHTML = "onmouseover=SelectIt(this)"
}

</script>
</head>
<body>
<form name="A">
<input type="checkbox" name="C1" onmouseover="SelectIt(this)" id="1"><br>
<input type="checkbox" name="C2" onmouseover="SelectIt(this)" id="2"><br>
<input type="checkbox" name="C3" onmouseover="SelectIt(this)" id="3"><br>
<input type="checkbox" name="C4" onmouseover="SelectIt(this)" checked="" disabled="disabled" id="4"><br>
<input type="checkbox" name="C5" onmouseover="SelectIt(this)" id="5"><br>
<input type="checkbox" name="C6" onmouseover="SelectIt(this)" id="6"><br>
<input type="checkbox" name="C7" onmouseover="SelectIt(this)" id="7"><br>
<input type="checkbox" name="C8" onmouseover="SelectIt(this)" id="8"><br>
</form>

</body>
</html>

在尝试了Stack Overflow的搜索功能并在Google上四处搜索之后，我至今还没有找到一个对我有意义的解决方案，尽管我仍在学习过程中，所以我担心我可能会尝试做一些对我的知识水平来说过于高级的事情。

您不必更改输入的事件来生成非结构化的JavaScript。不能使用JavaScript的代理只会忽略onmouseover属性。由于我希望你在服务器端生成复选框，所以不必害怕复制。

< P>我会考虑为任何客户端抓取jQuery。例如，您的问题可以非常容易地在jQuery中建模，并且只需极少的代码：

$(':checkbox').mouseover(function()
{
    this.checked = !this.checked;
});

这会抓取页面上的所有复选框，将mouseover事件附加到这些复选框上，然后当鼠标悬停时，它会简单地切换元素上选中属性的状态

你有没有研究过像jQuery或YUI这样的javascript库？我建议你在codereview.stackexchange.com上尝试这样的问题，因为这些问题一般都是关于风格的，没有具体的优化。在这样的网站上使用激光可以提高网站的效率。

$(':checkbox').mouseover(function()
{
    this.checked = !this.checked;
});