首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > PHP >

用小窗口表示入力值的执行出错解决思路

2012-04-16 
用小窗口表示入力值的执行出错http://www.mredkj.com/tutorials/tableaddrow.html上边的网站有执行表示,我

用小窗口表示入力值的执行出错
http://www.mredkj.com/tutorials/tableaddrow.html

上边的网站有执行表示,我把网页上的代码,改了<form...文件名>,
做一个新的php、文件名为getval_0403_02.php
可是无法像网上的一样,把写入值显示出来。

请哪位高手告诉一下,需要改写哪里会和网上一样。
谢谢


<script>
// Last updated 2006-02-21
function addRowToTable()
{
  var tbl = document.getElementById('tblSample');
  var lastRow = tbl.rows.length;
  // if there's no header row in the table, then iteration = lastRow + 1
  var iteration = lastRow;
  var row = tbl.insertRow(lastRow);
  
  // left cell
  var cellLeft = row.insertCell(0);
  var textNode = document.createTextNode(iteration);
  cellLeft.appendChild(textNode);
  
  // right cell
  var cellRight = row.insertCell(1);
  var el = document.createElement('input');
  el.type = 'text';
  el.name = 'txtRow' + iteration;
  el.id = 'txtRow' + iteration;
  el.size = 40;
  
  el.onkeypress = keyPressTest;
  cellRight.appendChild(el);
  
  // select cell
  var cellRightSel = row.insertCell(2);
  var sel = document.createElement('select');
  sel.name = 'selRow' + iteration;
  sel.options[0] = new Option('text zero', 'value0');
  sel.options[1] = new Option('text one', 'value1');
  cellRightSel.appendChild(sel);
}
function keyPressTest(e, obj)
{
  var validateChkb = document.getElementById('chkValidateOnKeyPress');
  if (validateChkb.checked) {
  var displayObj = document.getElementById('spanOutput');
  var key;
  if(window.event) {
  key = window.event.keyCode; 
  }
  else if(e.which) {
  key = e.which;
  }
  var objId;
  if (obj != null) {
  objId = obj.id;
  } else {
  objId = this.id;
  }
  displayObj.innerHTML = objId + ' : ' + String.fromCharCode(key);
  }
}
function removeRowFromTable()
{
  var tbl = document.getElementById('tblSample');
  var lastRow = tbl.rows.length;
  if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}
function openInNewWindow(frm)
{
  // open a blank window
  var aWindow = window.open('', 'TableAddRowNewWindow',
  'scrollbars=yes,menubar=yes,resizable=yes,toolbar=no,width=400,height=400');
   
  // set the target to the blank window
  frm.target = 'TableAddRowNewWindow';
  
  // submit
  frm.submit();
}
function validateRow(frm)
{
  var chkb = document.getElementById('chkValidate');
  if (chkb.checked) {
  var tbl = document.getElementById('tblSample');
  var lastRow = tbl.rows.length - 1;
  var i;
  for (i=1; i<=lastRow; i++) {
  var aRow = document.getElementById('txtRow' + i);
  if (aRow.value.length <= 0) {
  alert('Row ' + i + ' is empty');
  return;
  }
  }
  }
  openInNewWindow(frm);
}
</script>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>

</head>
<body>
<!--<form action="tableaddrow_nw.html" method="get">-->
<form action="getval_0403_02.php" method="get">



<p>
<input type="button" value="Add" onclick="addRowToTable();" />
<input type="button" value="Remove" onclick="removeRowFromTable();" />
<input type="button" value="Submit" onclick="validateRow(this.form);" />
<input type="checkbox" id="chkValidate" /> Validate Submit
</p>
<p>
<input type="checkbox" id="chkValidateOnKeyPress" checked="checked" /> Display OnKeyPress
<span id="spanOutput" style="border: 1px solid #000; padding: 3px;"> </span>
</p>
<table border="1" id="tblSample">
  <tr>
  <th colspan="3">Sample table</th>
  </tr>
  <tr>
  <td>1</td>
  <td><input type="text" name="txtRow1"
  id="txtRow1" size="40" onkeypress="keyPressTest(event, this);" /></td>
  <td>
  <select name="selRow0">
  <option value="value0">text zero</option>
  <option value="value1">text one</option>
  </select>
  </td>
  </tr>
</table>
</form>

[解决办法]
这个教程没有使用服务器端技术。它也只是提交到一个静态HTML页面,通过浏览器端javascript脚本解析URL get参数。源码如下

HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>Table Add Row - new window</title><script language="JavaScript"><!--function printToPage(){    var pos;    var searchStr = window.location.search;    var searchArray = searchStr.substring(1,searchStr.length).split('&');    var htmlOutput = '';    for (var i=0; i<searchArray.length; i++) {        htmlOutput += searchArray[i] + '<br />';    }    return(htmlOutput);}//--></script></head><body><b>MREDKJ's Table Add Row</b><br />Below should be the name/value pairs that were submitted:<p><script language="JavaScript"><!--document.write(printToPage());//--></script></p></body></html> 

热点排行