Question

我正在尝试创建一个包含2个表的发票的网页，该表包含作业及其相关任务。我使用node.js用mysql数据填充表。

还有4个iframe用于显示任务的计时器。我有一个Javascript函数，检查iframe是否已加载并且如果没有则可见，然后将计时器加载到iframe中，如果是，则检查下一个，依此类推，直到检查完所有4个。该函数在加载iframe后退出，因此一次只加载1个iframe。

这个工作正常，但无论我点击哪个任务移动到计时器，表中的第一个项目都被加载。换句话说，如果表中列出了5个任务，则第一个项始终是加载的项，无论我选择哪个项。

这是html

<div style='position:absolute;left:8px;top:88px;width:1000px;'>

<table align='left' border='1' ; style='font-size:16px;width:79%'>
 <tr>
   <th align='left'  style='background-color: #00b0e6;'><%= job1 %></th>
   <th align='center'  style='background-color: #00b0e6;'></th>
   <th align='center' style='background-color: #00b0e6;'> Employee </th>
   <th align='center' style='background-color: #00b0e6;'> Status </th>
   <th align='center' style='background-color: #00b0e6;'> Charges </th>
 </tr>

<%
 for (var i in taskrows) {
   if (taskrows[i].JobID == jb1){
   var task = taskrows[i].Task;
   var emp = taskrows[i].Employee;
   var status = taskrows[i].Status;
   var extended = "$"+taskrows[i].Extended.toFixed([2]);
   var id = taskrows[i].ID;
   var instid = rows[0].InstID

%>

<tr>
  <td width='45%'><%= task %></td>
  <td width='2%'><form id='form1' ><input type='hidden' name='id' value=<%= id %>/><input type='hidden' name='instid' value=<%= instid %>/><input type='button' id="11" name='submit-btn'  src='images/clock.jpg' width='30' height='20' value='submit' onClick='moveBench();' /></form></td>
  <td align='center' width='15%'><%= emp %></td>
  <td align='center' width='20%'><%= status %></td>
  <td align='center' width='10%'><%= extended %></td>
  <td width='35%'></td></tr>
<%}
}%>
</tr>
</table>

和javascript函数

function checkTimer(){
  var ben = parent.document.getElementById('bench').style.height = "340px";
  var inv = parent.document.getElementById('invoice').style.height = "340px";

  var test = document.getElementById('form1');
  var id = [
    parent.document.getElementById('timer1'),
    parent.document.getElementById('timer2'),
    parent.document.getElementById('timer3'),
    parent.document.getElementById('timer4')
];
  for(var i = 0; i < 4; i++){
    if(!id[i].style.display){
      id[i].style.display = 'block'; id[i].style.visibility = 'visible'; value="" ;
      var a = i;
      var t = document.getElementById("form1").target='timer'+(a+1);
      var action = document.getElementById("form1").action='timer1';
      alert(document.getElementById("form1").target);
      alert(action= document.getElementById("form1").action);
      document.getElementById("form1").submit();
      return; 
      }

  }

Answer 1

我找到了问题的解决方案，并认为我会分享它。

<script>
  function checkTimer(){
  var ben = parent.document.getElementById('bench').style.height = "340px"; // resize the list
 var inv = parent.document.getElementById('invoice').style.height = "340px"; //Resize the Invoice

 var id = [
   parent.document.getElementById('timer1'),
   parent.document.getElementById('timer2'),
   parent.document.getElementById('timer3'),
   parent.document.getElementById('timer4')
];
for(var i = 0; i < 4; i++){
  if(!id[i].style.display){
    id[i].style.display = 'block'; id[i].style.visibility = 'visible'; value="" ;
    var a = i;
    $("a").attr('target','timer'+(a+1));
    return; 
    }

  }

}

我使用了超链接而不是表单，然后使用上面的javascript来微缩超链接的目标属性，它的工作原理我觉得很好。如果有人发现这样做有潜在问题，请随时告诉我。

为什么我的javascript传递错误的信息？

1 个答案: