文本区域值在新行中
textarea values in new line
这是我的代码:
<!DOCTYPE html>
<html>
<head>
<title>Generate Budget</title>
</head>
<script type="text/javascript">
function tableprint()
{
var numOfYears = Math.abs(document.getElementById('end').value - document.getElementById('start').value);
var budget = Math.abs(document.getElementById('budget').value);
var i = 0;
var tableHtml = "";
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat(Number(document.getElementById('start').value)+Number(i));
tableHtml = tableHtml.concat("Budget");
tableHtml = tableHtml.concat(budget/numOfYears);
tableHtml = tableHtml.concat("Forecast");
tableHtml = tableHtml.concat(Number(document.getElementById('for'+i).value));
tableHtml = tableHtml.concat("Actual");
tableHtml = tableHtml.concat(Number(document.getElementById('act'+i).value));
}
document.getElementById("form2").innerHTML = tableHtml;
}
function generateBudget()
{
var numOfYears = Math.abs(document.getElementById('end').value - document.getElementById('start').value);
var budget = Math.abs(document.getElementById('budget').value);
var i = 0;
if( numOfYears < 1)
{
numOfYears = 1;
}
var tableHtml = "<table><tr>";
tableHtml = tableHtml.concat("<td></td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat(Number(document.getElementById('start').value)+Number(i));
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr>");
tableHtml = tableHtml.concat("<tr><td>Budget</td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat(budget/numOfYears);
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr>");
tableHtml = tableHtml.concat("<tr><td>Forecast</td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat("<input type='text' name='for" +Number(i)+"' id='for" + Number(i) + "' />");
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr>");
tableHtml = tableHtml.concat("<tr><td>Actual</td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat("<input type='text' name='act" +Number(i)+"' id='act" + Number(i) + "' />");
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr></table>");
tableHtml = tableHtml.concat("<center><input type='button' name='submit' id='submit' value='Submit' onClick='tableprint()' /></center>");
document.getElementById("form").innerHTML = tableHtml;
}
</script>
<body>
<table>
<tr>
<td> Start Year </td>
<td> <input type="text" name="start" id="start" value="2015"/>
<td> End Year </td>
<td> <input type="text" name="end" id="end" value="2020" />
</tr>
<tr>
<td></td>
<td></td>
<td>Budget</td>
<td> <input type="text" name="budget" id="budget" value="5522"/>
<td> <input type="button" name="generate" id="generate" value="Generate" onClick="generateBudget()"/></td>
</tr>
</table>
<div id="form" name="form"></div>
<textarea id="form2">
</textarea>
</body>
</html>
在文本区,我得到了这样的输入:
2016Budget1104.4Forecast0Actual02017Budget1104.4Forecast0Actual02018Budget1104.4Forecast0Actual02019Budget1104.4Forecast0Actual02020Budget1104.4Forecast0Actual0
如何在文本区域获得值:
(2015:Budget(value);Forecast: (value);actual:(value));(2016:Budget(value);----so on
我只在tableprint()函数中做了修改:
<!DOCTYPE html>
<html>
<head>
<title>Generate Budget</title>
</head>
<script type="text/javascript">
function tableprint()
{
var numOfYears = Math.abs(document.getElementById('end').value - document.getElementById('start').value);
var budget = Math.abs(document.getElementById('budget').value);
var i = 0;
var tableHtml = "";
for (i=1; i<=numOfYears; i++)
{ tableHtml = tableHtml.concat("(");
tableHtml = tableHtml.concat( Number(document.getElementById('start').value)+Number(i)+":");
tableHtml = tableHtml.concat("Budget:");
tableHtml = tableHtml.concat("("+budget/numOfYears+");");
tableHtml = tableHtml.concat("Forecast:");
tableHtml = tableHtml.concat("("+Number(document.getElementById('for'+i).value)+");");
tableHtml = tableHtml.concat("Actual:");
tableHtml = tableHtml.concat("("+Number(document.getElementById('act'+i).value)+"));");
}
document.getElementById("form2").innerHTML = tableHtml;
}
function generateBudget()
{
var numOfYears = Math.abs(document.getElementById('end').value - document.getElementById('start').value);
var budget = Math.abs(document.getElementById('budget').value);
var i = 0;
if( numOfYears < 1)
{
numOfYears = 1;
}
var tableHtml = "<table><tr>";
tableHtml = tableHtml.concat("<td></td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat(Number(document.getElementById('start').value)+Number(i));
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr>");
tableHtml = tableHtml.concat("<tr><td>Budget</td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat(budget/numOfYears);
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr>");
tableHtml = tableHtml.concat("<tr><td>Forecast</td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat("<input type='text' name='for" +Number(i)+"' id='for" + Number(i) + "' />");
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr>");
tableHtml = tableHtml.concat("<tr><td>Actual</td>");
for (i=1; i<=numOfYears; i++)
{
tableHtml = tableHtml.concat("<td>");
tableHtml = tableHtml.concat("<input type='text' name='act" +Number(i)+"' id='act" + Number(i) + "' />");
tableHtml = tableHtml.concat("</td>");
}
tableHtml = tableHtml.concat("</tr></table>");
tableHtml = tableHtml.concat("<center><input type='button' name='submit' id='submit' value='Submit' onClick='tableprint()' /></center>");
document.getElementById("form").innerHTML = tableHtml;
}
</script>
<body>
<table>
<tr>
<td> Start Year </td>
<td> <input type="text" name="start" id="start" value="2015"/>
<td> End Year </td>
<td> <input type="text" name="end" id="end" value="2020" />
</tr>
<tr>
<td></td>
<td></td>
<td>Budget</td>
<td> <input type="text" name="budget" id="budget" value="5522"/>
<td> <input type="button" name="generate" id="generate" value="Generate" onClick="generateBudget()"/></td>
</tr>
</table>
<div id="form" name="form"></div>
<textarea id="form2">
</textarea>
</body>
</html>
您将得到如下输出:
(2016:Budget:(value);Forecast:(value);Actual:(value));
(2017:Budget:(value);Forecast:(value);Actual:(value));
(2018:Budget:(value);Forecast:(value);Actual:(value));
(2019:Budget:(value);Forecast:(value);Actual:(value));
(2020:Budget:(value);Forecast:(value);Actual:(value));
相关文章:
- 阻止ReSharper将JavaScript函数参数放到新行中
- HTML表内容:如果行很长,如何在新行中显示部分内容
- 在新行中显示现有项目中的表行中的值
- JavaScript 文本区域值,带有数据库中的新行
- 用于在表中添加行的Javascript代码将单元格中的数据复制到新行中
- 将字符串结果返回到表单元格中的新行中
- 使用Javascript在文本区域中添加新行
- 在数据表的新行中添加按钮,变得未定义
- 将文本区域中的文本按新行(包括空行)拆分为 javascript 数组
- 文本区域中的新行字符会增加 C# 中的文本长度
- 如何使用javascript或jquery创建tr的克隆并在新行中插入数据
- 为 HTML 文本区域中的新行添加效果
- 使用数据表(Meteor Tabular)在新行中绘制数组的每个元素
- 如何在7个字母/字母表/数字和新行中的新字母后的键向上插入分隔符-Jquery
- 输入区域中出现PHP错误的新行
- 文本区域值在新行中
- 如何从表中的每个新行中删除类
- 字符串在源代码的新行中中断,而不是在浏览器中
- 用下拉菜单在新行中选择文本
- 在新行中输出模板字符串