checkbox是否有鼠标移上去的效果--立即结贴

不知道FF下有没有！通常checkbox和radio都需要模拟来实现特殊外观效果！

解决方案 »

  1.   

    <html>
    <script language="javascript"> var node;
    var inited=false; var init=function(){
    node=document.getElementById("example");
    inited=true;
    } var _check_over=function(){
    if(!inited){
    return;
    } node.style.borderStyle="solid"; node.style.borderColor="#FFCC00"; node.style.backgroundColor="#EEEEEE";

    }
    </script>
    <body onload="init()">
    <input type="checkbox" id="example" onmouseover="_check_over()" />
    </body>
    </html>
      

  2.   

    but only in IE.sorry of this.
      

  3.   

    二楼的不是我想要的那种效果
    就相当于
    我鼠标划过某行的时候这个checkbox获得焦点一样的东西
      

  4.   

    this is the hole version<html>
    <script language="javascript"> var node;
    var inited=false; var init=function(){
    node=document.getElementById("example");
    inited=true;
    } var _check_over=function(){
    if(!inited){
    return;
    } node.style.borderStyle="solid"; node.style.borderColor="#FFCC00"; node.style.backgroundColor="#EEEEEE";

    } var _check_out=function(){
    if(!inited){
    return;
    } node.style.borderStyle=""; node.style.borderColor=""; node.style.backgroundColor="";

    } var _check_it=function(){
    if(!inited){
    return;
    }
    if(node.checked){
    node.checked=false;
    }else{
    node.checked=true;
    }
    }</script><body onload="init()">
    <p onmouseover="_check_over()" onmouseout="_check_out()" onclick="_check_it()">
    <input type="checkbox" id="example" onmouseover="_check_over()" onmouseout="_check_out()" onclick="_check_it()" />
    This is a test!
    </p>
    </body>
    </html>
      

  5.   

    you can try this. and if you still have problems, send mail to me: [email protected]
      

  6.   

    but I think you will like this version<html>
    <script language="javascript"> var node;
    var inited=false; var init=function(){
    node=document.getElementById("example");
    inited=true;
    } var _check_over=function(){
    if(!inited){
    return;
    }
    node.style.borderStyle="solid";
    node.style.borderColor="#FFCC00";
    node.style.backgroundColor="#EEEEEE";
    } var _check_out=function(){
    if(!inited){
    return;
    }
    node.style.borderStyle="";
    node.style.borderColor="";
    node.style.backgroundColor="";
    } var _check_it=function(){
    if(!inited){
    return;
    }
    if(node.checked){
    node.checked=false;
    }else{
    node.checked=true;
    }
    }
    </script>
    <body onload="init()">
    <p onmouseover="_check_over()" onmouseout="_check_out(); this.style.cursor='pointer';" onclick="_check_it()">
    <input type="checkbox" id="example" onmouseover="_check_over()" onmouseout="_check_out()" onclick="_check_it()" />
    This is a test!
    </p>
    </body>
    </html>
      

  7.   

    purplecalm([email protected]) ( ) 信誉：100    Blog   加为好友  2007-06-14 14:34:44  得分: 0  
    --------------------------
    where are you come from?
      

  8.   

    hello. I got a new version, I think it is better than above.<html>
    <script language="javascript"> var node;
    var inited=false; var init=function(){
    node=document.getElementById("example");
    inited=true;
    } var _check_over=function(){
    if(!inited){
    return;
    }
    node.style.borderStyle="solid";
    node.style.borderColor="#FFCC00";
    node.style.backgroundColor="#EEEEEE";
    document.getElementById("test_line").style.display="inline";
    document.getElementById("test_line").style.borderBottom="1px solid red";
    document.getElementById("test_line").style.cursor="pointer";
    } var _check_out=function(){
    if(!inited){
    return;
    }
    node.style.borderStyle="";
    node.style.borderColor="";
    node.style.backgroundColor="";
    document.getElementById("test_line").style.border="0";
    } var _check_it=function(){
    if(!inited){
    return;
    }
    if(node.checked){
    node.checked=false;
    }else{
    node.checked=true;
    }
    }</script><body onload="init()">
    <p id="test_line" onmouseover="_check_over();" onmouseout="_check_out()" onclick="_check_it();">
    <input type="checkbox" id="example" onmouseover="_check_over()" onmouseout="_check_out()" onclick="_check_it()" />
    This is a test!
    </p>
    </body>
    </html>
      

  9.   

    楼上将mouseover,mouseout,onkick情况都已经列出,楼主完全可以按照自己的选择设置想要的样式了.
      

  10.   

    There are lots of IT Companies in ChengDu.
      

  11.   

    哪有那么复杂啊,给你个最简单的
    <checkbos id="ck1"/><label for="ck1">dddddddddddddd</label>
    这样鼠标移动到ddddd上checkbox就有变化了
      

  12.   

    不好意思,拼写上有点问题.
    <input type="checkbox" id="ck1"/><label for="ck1">dddddddddddddd</label>
      

  13.   

    gigi311 如何让 tr 也可以呢？
      

  14.   

    我最理想的效果就是
    让tr也有for的效果
    不知道可以不可以