0
我需要你的幫助。在動態生成的html數據表上應用jQuery Resizable
我似乎無法得到jQuery Resizable API來處理我的動態生成的數據表生成後。看來函數調用它，它已經完成之後，但我得到一個錯誤「對象預期」
<!DOCTYPE html>
<html>
<head>
<!-- LOAD JQUERY LIBRARY: -->
<link href="/jq/images/jquery-ui.css" type="text/css" rel="stylesheet" />
<script src="/jq/jquery.min.js" type="text/javascript"> </script>
<script src="/jq/jquery-ui.min.js" type="text/javascript"> </script>
<style type="text/css">
#mstrWrapper {
position: relative;
height: 200px;
width: 800px;
border: 1px solid #808080;
overflow-y: scroll;
overflow-x: scroll;
scrollbar-base-color: #DFDFDF;
scrollbar-arrow-color: #235A81;
}
#mstrTable {
width: 800px;
color: #235A81;
font-family: Arial;
font-size: 9pt;
border: 0px;
}
#mstrTable th, #mstrTable td {
border-bottom: 1px solid #808080;
border-right: 1px solid #808080;
padding: 3px;
}
#mstrTable th {
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#cdcdcd");
width: 110px;
height: 18px;
border-bottom: 1px solid #808080;
border-top: 0px;
}
#mstrTable tbody tr:first-child td {
padding: 3px 3px 3px 3px;
}
#mstrTable tr.normal td {
color: #235A81;
background-color: white;
}
#mstrTable tr.highlighted td {
color: #FFFFFF;
background-color: #235A81;
}
</style>
<script type="text/javascript">
var table
var tbody
var ishigh
function writeit() {
var html = '<table id="mstrTable" cellspacing="0" cellpadding="0" class="ui-widget-content">\n'
html +='<thead>\n'
html +='<tr> \n'
html +='<th>File Number<\/th>\n'
html +='<th>Date1<\/th>\n'
html +='<th>Date2<\/th>\n'
html +='<th>Status<\/th>\n'
html +='<th>Num.<\/th>\n'
html +='<\/tr>\n'
html +='<\/thead>\n'
html +='<tbody>\n'
html +='<tr> \n'
html +='<td>KABC<\/td>\n'
html +='<td>09\/12\/2002<\/td>\n'
html +='<td>09\/12\/2002<\/td>\n'
html +='<td>Submitted<\/td>\n'
html +='<td>0<\/td>\n'
html +='<\/tr>\n'
html +='<tr> \n'
html +='<td>KCBS<\/td>\n'
html +='<td>09\/11\/2002<\/td>\n'
html +='<td>09\/11\/2002<\/td>\n'
html +='<td>Lockdown<\/td>\n'
html +='<td>2<\/td>\n'
html +='<\/tr>\n'
html +='<tr>\n'
html +='<td>WFLA<\/td>\n'
html +='<td>09\/11\/2002<\/td>\n'
html +='<td>09\/11\/2002<\/td>\n'
html +='<td>Submitted<\/td>\n'
html +='<td>1<\/td>\n'
html +='<\/tr>\n'
html +='<tr> \n'
html +='<td>WPPP<\/td>\n'
html +='<td>03\/19\/2003<\/td>\n'
html +='<td>03\/19\/2003<\/td>\n'
html +='<td>In-Progress<\/td>\n'
html +='<td>0<\/td>\n'
html +='<\/tr>\n'
html +='<tr> \n'
html +='<td>WRRR<\/td>\n'
html +='<td>02\/19\/2002<\/td>\n'
html +='<td>02\/19\/2002<\/td>\n'
html +='<td>Submitted<\/td>\n'
html +='<td>5<\/td>\n'
html +='<\/tr>\n'
html +='<tr>\n'
html +='<td>WTTT<\/td>\n'
html +='<td>02\/19\/2002<\/td>\n'
html +='<td>02\/19\/2002<\/td>\n'
html +='<td>In-Progress<\/td>\n'
html +='<td>0<\/td>\n'
html +='<\/tr>\n'
html +='<tr> \n'
html +='<td>WYYD<\/td>\n'
html +='<td>02\/11\/2002<\/td>\n'
html +='<td>02\/11\/2002<\/td>\n'
html +='<td>Submitted<\/td>\n'
html +='<td>7<\/td>\n'
html +='<\/tr>\n'
html +='<tr> \n'
html +='<td>WRRR<\/td>\n'
html +='<td>02\/19\/2002<\/td>\n'
html +='<td>02\/19\/2002<\/td>\n'
html +='<td>Submitted<\/td>\n'
html +='<td>5<\/td>\n'
html +='<\/tr>\n'
html +='<\/tbody>\n'
html +='<\/table>'
document.getElementById('mstrWrapper').innerHTML = html
$("#mstrTable tr th").resizable({ handles: 'e' });
}
</script>
</head>
<body>
<div id="mstrWrapper"></div>
<input type="button" value="LOAD" onclick="writeit()">
</body>
</html>
似乎在此行的代碼失敗，我看不出有什麼錯，它應該工作：
$("#mstrTable tr th").resizable({ handles: 'e' });