0
我有一種情況，我的JQuery Ajax腳本生成HTML表格。另一個腳本旨在通過在該特定列中提供包含唯一值的下拉列表來過濾表列。一個Javascript無法讀取由AJAX腳本生成的數據
如果我在html頁面中有靜態內容，過濾器腳本可以正常工作。但是當它通過運行期間的Ajax生成時，無法讀取表格內容。
任何想法可能是什麼原因。我也嘗試按順序排列腳本。
我的Ajax腳本是在這裏： - ：
<html>
<body>
<table class="table table-bordered table-condensed table-hover example sort01 table-autosort:0 table-autofilter table-autopage:10 table-page-number:t1page table-page-count:t1pages table-filtered-rowcount:t1filtercount table-rowcount:t1allcount">
<thead >
<tr>
<th class="table-sortable:numeric" Style="width:3%;">No.</th>
<th class="table-sortable:default" Style="width:5.5%;">Issue Key <br>
</th>
<th>Type</th>
<th Style="text-align: center;">Summary</th>
<th Style="text-align: center;">Description</th>
<th class="table-filterable table-sortable:default" id ="priorityColumn" Style="width:5%">Priority</th>
<th class="table-filterable table-sortable:default" >Component</th>
<th class="table-filterable table-sortable:default" Style="width:5%">Status</th>
<th class="table-filterable table-sortable:default">Fix Version</th>
<th class="table-filterable table-sortable:default" Style="width:6%">Resolution</th>
<th>Created</th>
<th>Updated</th>
<th>OS</th>
<th>Frequency</th>
<th>Attachments</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<td class="table-page:previous" style="cursor:pointer;"><img src="table/icons/previous.gif" alt="Previous"><small>Prev</small></td>
<td colspan="13" style="text-align:center;">Page <span id="t1page"></span> of <span id="t1pages"></span></td>
<td class="table-page:next" style="cursor:pointer;">Next <img src="table/icons/next.gif" alt="Previous"></td>
</tr>
<tr Style="background-color: #dddddd">
<td colspan="15"><span id="t1filtercount"></span> of <span id="t1allcount"></span> rows match filter(s)</td>
</tr>
<tr class="text-success">
<td colspan="15">Total Results : ${count}</td>
</tr>
</tfoot>
</table>
</body>
</html>
$(document).ready(function() {
$("#getResults").click(function(){
bug = $("#bug").val();
priority = $("#priority").val();
component = $("#component").val();
fixVersion = $("#fixVersion").val();
dateType = $("#dateType").val();
fromDate = $("#dp2").val();
toDate = $("#dp3").val();
$("#query").empty();
$("tbody").empty();
$.post("getRefineSearchResultsPath", {bug:bug,priority:priority,component:component,
fixVersion:fixVersion,dateType:dateType,fromDate:fromDate,toDate:toDate },
function(data) {
// setting value for csv report button
//clear the value attribute for button first
$("#query_csv").removeAttr("value");
//setting new value to "value" attribute of the csv button
$("#query_csv").attr("value", function(){
return $(data).find("query").text();
});
$("#query").append("<p class='text-success'>Query<legend></legend><small>" +$(data).find("query").text() +"</small></p>");
var count = 1;
$(data).find("issue").each(function(){
var $issue = $(this);
var value = "<tr>";
value += "<td>" +count +"</td>";
value += "<td>" +$issue.find('issueKey').text() +"</td>";
value += "<td>" +$issue.find('type').text() +"</td>";
value += "<td><div id='list' class='summary'>" +$issue.find('summary').text() +"</div></td>";
value += "<td><div id='list' class='mousescroll'>" +$issue.find('description').text() +"</div></td>";
value += "<td>" +$issue.find('priority').text() +"</td>";
value += "<td>" +$issue.find('component').text() +"</td>";
value += "<td>" +$issue.find('status').text() +"</td>";
value += "<td>" +$issue.find('fixVersion').text() +"</td>";
value += "<td>" +$issue.find('resolution').text() +"</td>";
value += "<td>" +$issue.find('created').text() +"</td>";
value += "<td>" +$issue.find('updated').text() +"</td>";
value += "<td>" +$issue.find('os').text() +"</td>";
value += "<td>" +$issue.find('frequency').text() +"</td>";
value += "<td>";
var number_of_attachement = $issue.find('attachment').size();
if(number_of_attachement > 0){
value += "<div id='list' class='attachment'>";
value += "<ul class='unstyled'>";
$issue.find('attachment').each(function(){
var $attachment = $(this);
value += "<li>";
value += "<a href='#' onclick='document.f1.attachmentName.value='" +$attachment.find('attachmentName').text();
value += "';document.f1.issueKey.value='"+$attachment.find('attachmentissueKey').text();
value += "';document.f1.digest.value='"+$attachment.find('attachmentdigest').text();
value += "';document.f1.submit();'>"+$attachment.find('attachmentName').text();
value += "</a>";
value += "</li>";
value += "<br>";
});
value +="</ul>";
value +="</div>";
}
value += "</td>";
value += "</tr>";
$("tbody").append(value);
count++;
});
});
});
});
而且我的腳本過濾表是在這裏，我從這個鏈接http://www.javascripttoolbox.com/lib/table/
我的JSP頁面在這裏得到了這個腳本
感謝您的迴應，我是新來的Ajax-jquery事實上這是我正在與這項技術工作的第一個項目。我還有一個很快的問題，我的方法是創建html表嗎？而且，如果仔細觀察ajax腳本，我已經寫下了標記的屬性，這是正確的嗎？謝謝:) – user1371033
解析XML的方法是正確的。您可以使用jQuery而不是'onclick'並編寫更少的代碼，並且將javascript從html中刪除。 jQuery是JavaScript，但從長遠來看，編碼更快更容易 – charlietfl
使用'$（'form'）。serialize（）'而不是冗長地將輸入值複製到同名變量中將使它更容易閱讀和調試。 – punund