この記事では、JS+CSSが選択したセルの表示を押すことができる方法について説明します。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
次のようにコードをコピーします:<html>
<head>
<Title> JS+CSS実装は、選択したセルを表示することができます</title>
<style>
TD {cursor:hand; font-size:12px}
.click {border-top:1px solid#0033cc; border-bottom:1px solid#ddeeff; border-left:1px solid#0033cc; border-right:1px solid #deeff; padding-top:5px; padding-bottom:3px; padding-right:5px; padding-right;}
.hover {border-top:1px solid #defeff; border-bottom:1px solid#0033cc; border-left:1px solid #defeff; border-right:1px solid#0033c; padding:4px;}
.normal {border:1px solid #fffff; padding:4px;}
</style>
</head>
<body>
<スクリプト>
関数overbutton(){
if(src = event.srcelement)
if(src.classname == "remorm"){
src.classname = 'hover';
}
}
関数outbutton(){
if(src = event.srcelement)
if(src.classname == "Hover"){
src.classname = 'normal';
}
}
関数clickbutton(){
if(src = event.srcelement)
if(src.classname == "Hover"){
var cels = document.all.button.rows [0] .cells;
for(i = 0; i <cells.length; i ++)
{cells [i] .classname = "rearn";
}
src.classname = 'click';
}
}
document.onmouseover = overbutton
document.onmouseout = outbutton
document.onclick = clickbutton </script>
<表ID =ボタン>
<tr>
<td class =クリック>毎日</td>
<td class = normal>毎週レポート</td>
<td class = normal>毎月のレポート</td>
<td class = normal> Quarterlyレポート</td>
<td class = normal>毎日</td>
<td class = normal>毎週レポート</td>
<td class = normal>毎月のレポート</td>
<td class = normal> Quarterlyレポート</td>
</tr>
</table>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。