0

我的搜索被证明是徒劳的,我希望有人能给我一些帮助。我对javascripting也很陌生。

我已经建立了一个由几个 DIV 标签组成的网站,中间有一个 iFRAME。我已经设置了一个 Javascript,它在 iframe 的 HTML 页面中加载一个表格。每行的第一个单元格包含一个名称。

我希望能够单击每一行并返回第一个单元格中的名称。现在我一直在使用警报功能来确定我的代码是否正常工作。

这是我的 iframe 源代码:

<script type="text/javascript" src="./cgi-bin/jquery-1.8.2.min.js"></script>
<script language="Javascript">
function xmlhttpGetVMList(strURL) {
   var xmlHttpReqVMList = false;
   var self = this;
   // Mozilla/Safari/Chrome
   if (window.XMLHttpRequest) {
    self.xmlHttpReqVMList = new XMLHttpRequest();
   }
   //IE
   else if (window.ActiveXObject) {
    self.xmlHttpReqVMList = new ActiveXObject("Microsoft.XMLHTTP");
   }
   self.xmlHttpReqVMList.open('GET', strURL, true);
   self.xmlHttpReqVMList.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
   self.xmlHttpReqVMList.onreadystatechange = function() {
    if (self.xmlHttpReqVMList.readyState == 4) {
       updatepage(self.xmlHttpReqVMList.responseText);
    }
   }
   self.xmlHttpReqVMList.send(null);
}

function updatepage(str) {
   document.getElementById("result").innerHTML = str;
}

$("#result").ready(function() {
JavaScript:xmlhttpGetVMList("./cgi-bin/db_list_vm.cgi");

//alert('Script DIV loaded');  // <-- useful to confirm the event has completed.
});

$("#result").ready(function () {
var table = document.getElementById('VMList'),
    cells = table.getElementByTagName('td');

for (var i=0,len=cells.length; i<len; i++){
   cells[i].onclick = function() {
    alert(this.innerText);
    }
}
});


</script>

<html>
<head>
<link href="./styles/default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="countleft"></div>
<div id="countright"> <b>VM Count: </b></div>
<br>
<br>
<form name="f1">
<div id="result">Loading ......<img src="./images/loading.gif" alt="loading"></img></div>
</form>


</body>
</html>

上面的代码运行并使用以下内容填充DIV ID结果的innerText:

<table id="VMList">
<thead>
<tr>
<th class="vmname">VMName</th>
<th class="ipaddr">IP Address</th>
<th class="FQDN">FQDN</th>
<th class="Team">Team Name</th>
<th class="Owner">Owner</th>
</tr>
</thead>
<tbody>
<tr id="vmname">
<td class="vmname">SomeName</td>
<td class="ipaddr">PlaceHolder</td>
<td class="FQDN">PlaceHolder</td>
<td class="Team">PlaceHolder</td>
<td class="Owner">PlaceHolder</td>
</tr></tbody></table></div>

使每一行可点击的我的脚本部分似乎不起作用。我相信这是因为代码在 Javascript 完成创建表之前运行。

在创建表后,我正在寻求帮助让此代码工作:

$("#result").ready(function () {
var table = document.getElementById('VMList'),
    cells = table.getElementByTagName('td');

for (var i=0,len=cells.length; i<len; i++){
   cells[i].onclick = function() {
    alert(this.innerText);
    }
}
});
4

1 回答 1

0

如何使用 $(document).ready 代替?此外,我们使用点击进行 Ajax 调用(或触发器)。

于 2012-11-08T19:50:08.547 回答