Question

我的搜索证明是徒劳的，我希望有人可以给我一些帮助。我对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);
    }
}
});

Answer 1

如何使用$（document）.ready代替？此外，我们使用单击按钮进行Ajax调用（或触发器）。

无法执行jQuery函数，因为在页面加载后加载了表

1 个答案: