+ -
当前位置:首页 → 问答吧 → JS 点击表格改变input的值

JS 点击表格改变input的值

时间:2011-12-14

来源:互联网

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv = "Content-type" content = "text/html; charset = gb2312">
<title>date selector</title>
<style type = "text/css" charset = "gb2312">
<!--
.change
{
background-color: red;
}
table
{
width: 183px;
height: 10px;
}
table tr
{
height: 10px;
font-size: 13px;
color: blue;
text-align: center;
}
.arrowSize
{
font-size: 7px;
}
.dateSize
{
font-size: 12px;
}
-->
</style>
</head>
<body>
<script>
<!--
var year = 2011;
var month = 12;
var date = 1;
var lastDay = new Date(year, month, 0);
lastDay = lastDay.getDate();
var firstDay = new Date(year, month-1, 1);
firstDay = firstDay.getDay();


var print = "";
var count = 0;
var weekNum = ['日', '一', '二', '三', '四', '五', '六' ];
print += "<table>";
print += "<tr>";
print += "<td><<</td>";
print += "<td><</td>";
print += "<td>2011年12月31日</td>";
print += "<td>></td>";
print += "<td>>></td>";
print += "</tr>";
print += "</table>";
print += "<table>";
print += "<tr height = \"20\">";
for( var iWeek = 0; iWeek < 7; iWeek++ )
{
print += "<td>"+weekNum[iWeek]+"</td>";
}
print += "</tr>";

for( var iRow = 0; iRow < 6; iRow++ )
{
print += "<tr>";
for( var iCol = 0; iCol < 7; iCol++ )
{
var value = count++;
if( count < 32 )
{
print += "<td onmouseover=this.className='change' onmouseout=this.className='' onclick = \"writeValue( "+this.count+" );\" />"+(value+1);
print += "</td>";
// print += "<td onmouseover=this.className='change' onmouseout=this.className='' onclick = \"alert("+count+");\">"+count; // alert("+count+");
}
}
print += "</tr>";
}
print += "</table>";
print += "<table><td><input style = \"text\" id = \"getInput\" value = "+this.date+"></td></table>";
document.write( print );

function writeValue( countTrans )
{
  代码想在这里实现。
}

-->
</script>
</body>
</html>


运行后我想将传输的值填入绘制的input标签的value中。
简单点就是改变input框内的值。

作者: puhjack   发布时间: 2011-12-14

又是你啊,js基础还要加强,看看dom吧

http://www.w3school.com.cn/htmldom/index.asp

HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv = "Content-type" content = "text/html; charset = gb2312">
<title>date selector</title>
<style type = "text/css" charset = "gb2312">
<!--
.change
{
background-color: red;
}
table
{
width: 183px;
height: 10px;
}
table tr
{
height: 10px;
font-size: 13px;
color: blue;
text-align: center;
}
.arrowSize
{
font-size: 7px;
}
.dateSize
{
font-size: 12px;
}
-->
</style>
</head>
<body>
<script>
<!--
var year = 2011;
var month = 12;
var date = 1;
var lastDay = new Date(year, month, 0);
lastDay = lastDay.getDate();
var firstDay = new Date(year, month-1, 1);
firstDay = firstDay.getDay();


var print = "";
var count = 0;
var weekNum = ['', '', '', '', '', '', '' ];
print += "<table>";
print += "<tr>";
print += "<td><<</td>";
print += "<td><</td>";
print += "<td>2011年12月31日</td>";
print += "<td>></td>";
print += "<td>>></td>";
print += "</tr>";
print += "</table>";
print += "<table>";
print += "<tr height = \"20\">";
for( var iWeek = 0; iWeek < 7; iWeek++ )
{
print += "<td>"+weekNum[iWeek]+"</td>";
}
print +=    "</tr>";

for( var iRow = 0; iRow < 6; iRow++ )
{
print += "<tr>";
for( var iCol = 0; iCol < 7; iCol++ )
{
var value = count++;
if( count < 32 )
{
print += "<td onmouseover=this.className='change' onmouseout=this.className='' onclick = \"writeValue( "+this.count+" );\" />"+(value+1);
print += "</td>";
// print += "<td onmouseover=this.className='change' onmouseout=this.className='' onclick = \"alert("+count+");\">"+count; // alert("+count+");
}
}
print += "</tr>";
}
print += "</table>";
print += "<table><td><input style = \"text\" id = \"getInput\" value = "+this.date+"></td></table>";
document.write( print );

function writeValue( countTrans )
{
  document.getElementById("getInput").value = countTrans;
}

-->
</script>
</body>
</html>

作者: p2227   发布时间: 2011-12-14

function writeValue( countTrans )
{
  //代码想在这里实现。
  document.getElementById("getInput").value=countTrans;
}

作者: kkjjww   发布时间: 2011-12-14

引用 1 楼 p2227 的回复:
又是你啊,js基础还要加强,看看dom吧

http://www.w3school.com.cn/htmldom/index.asp


HTML code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<h……


我先开始这么写
function writeValue( countTrans )
{
var getPut = document.getElementById( 'getInput' ).value;
getPut = countTrans;
// 但是不能成功,百思不得其解。
}
p2227大哥留个联系方式呗,现在有点崇拜你咯。
[email protected]
121467359

作者: puhjack   发布时间: 2011-12-14