选号用JS怎么实现来，高人请进指点下，多谢
日期：2014-05-16 浏览次数：20336 次
选号用JS如何实现来，高人请进指点下，谢谢。
我有一个表格如下
0 1 2 3 4 5 6 7 8 9
0 1 2 3 4 5 6 7 8 9
0 1 2 3 4 5 6 7 8 9
背景是一个图片
还有一个文本域，我想实现，每点击一次表格，在文本域上显示相应的号码，并换成另一个背景图片，当再次点击时图片还原，文本域上的数字也被删除，而且在第一行数据不管显示多少个，当单击第二行的时候，在前面加一个”|“显示在文本域上，第三行如是。
在线等，哪们高人给指点下，谢谢呵。
------解决方案--------------------
汗~~难道我写的你就能看懂?
<html>
<style>
#tab td{
cursor : hand;
border: thick solid yellow;
}
.selected{
background-color:black;
color:white;
}
.unselected{
background-color:white;
}
</style>
<script>
function CreateRow(){
var row=document.createElement( "tr ");
for(var i=0;i <10;i++){
var cell=document.createElement( "td ");
cell.onclick=CellOnClick;
cell.innerHTML=i;
cell.className= "unselected ";
row.appendChild(cell);
cell.ParentRow=row;
}
return row;
}
function CellOnClick(){
this.className=this.className== "unselected "? "selected ": "unselected ";
ResetTextBox();
}
function ResetTextBox(){
var txt=document.getElementById( "result ");
var tab=document.getElementById( "tab ");
var rows=tab.rows;
var str= " ";
for(var i=0;i <rows.length;i++){
if(str!= " ")str+= "| ";
for(var j=0;j <rows[i].cells.length;j++){
if(rows[i].cells[j].className== "selected ")
str+=rows[i].cells[j].innerHTML;
}
}
txt.innerHTML=str;
}
window.onload=function (){
var tab=document.getElementById( "tab ");
var tbody=document.createElement( "tbody ")
var tr1=CreateRow();
var tr2=CreateRow();
var tr3=CreateRow();
tbody.appendChild(tr1);
tbody.appendChild(tr2);
tbody.appendChild(tr3);
tab.appendChild(tbody);
}
</script>
<body>
<table id= "tab " > </table>
<textarea id= "result " cols= "30 " readonly rows= "5 "> </textarea>
</body>
</html>
我有一个表格如下
0 1 2 3 4 5 6 7 8 9
0 1 2 3 4 5 6 7 8 9
0 1 2 3 4 5 6 7 8 9
背景是一个图片
还有一个文本域，我想实现，每点击一次表格，在文本域上显示相应的号码，并换成另一个背景图片，当再次点击时图片还原，文本域上的数字也被删除，而且在第一行数据不管显示多少个，当单击第二行的时候，在前面加一个”|“显示在文本域上，第三行如是。
在线等，哪们高人给指点下，谢谢呵。
------解决方案--------------------
汗~~难道我写的你就能看懂?
<html>
<style>
#tab td{
cursor : hand;
border: thick solid yellow;
}
.selected{
background-color:black;
color:white;
}
.unselected{
background-color:white;
}
</style>
<script>
function CreateRow(){
var row=document.createElement( "tr ");
for(var i=0;i <10;i++){
var cell=document.createElement( "td ");
cell.onclick=CellOnClick;
cell.innerHTML=i;
cell.className= "unselected ";
row.appendChild(cell);
cell.ParentRow=row;
}
return row;
}
function CellOnClick(){
this.className=this.className== "unselected "? "selected ": "unselected ";
ResetTextBox();
}
function ResetTextBox(){
var txt=document.getElementById( "result ");
var tab=document.getElementById( "tab ");
var rows=tab.rows;
var str= " ";
for(var i=0;i <rows.length;i++){
if(str!= " ")str+= "| ";
for(var j=0;j <rows[i].cells.length;j++){
if(rows[i].cells[j].className== "selected ")
str+=rows[i].cells[j].innerHTML;
}
}
txt.innerHTML=str;
}
window.onload=function (){
var tab=document.getElementById( "tab ");
var tbody=document.createElement( "tbody ")
var tr1=CreateRow();
var tr2=CreateRow();
var tr3=CreateRow();
tbody.appendChild(tr1);
tbody.appendChild(tr2);
tbody.appendChild(tr3);
tab.appendChild(tbody);
}
</script>
<body>
<table id= "tab " > </table>
<textarea id= "result " cols= "30 " readonly rows= "5 "> </textarea>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
