有一个使用TableFilter https://www.tablefilter.com/创建的表,数据存储在geoJSON中。有必要按图片过滤,图片是从数组的2个元素(图片本身及其标题)中收集的。默认情况下,TableFilter不允许过滤包含多个数组元素的值。如何解决这个问题,也许有人遇到了这个问题?
var tbody = '';
resOrg.features.forEach(
function (item, i, arr) {
tbody += "<tr><td class='all'>" + item.properties.id + "</td><td>"
+ item.properties.title + "</td><td>"
+ item.properties.country + "</td><td align='center'>"
+ item.properties.googleMapIcon + "</td><td align='center'>"
+ item.properties.resOrgType + "</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir1+"'"+"width='16' height='16' title='"+item.properties.AbbrDir1+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir2 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir2+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir3 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir3+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir4 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir4+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir5 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir5+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir6 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir6+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir7 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir7+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir8 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir8+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir9 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir9+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir10 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir10+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir11 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir11+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir12 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir12+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir13 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir13+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir14 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir14+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir15 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir15+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir16 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir16+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir17 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir17+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir18 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir18+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir19 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir19+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir20 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir20+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir21 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir21+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir22 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir22+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir23 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir23+"' />"+"</td><td align='center'>"+"<img src='images/icons/"
+ item.properties.ResDir24 + "'"+"width='16' height='16' title='"+item.properties.AbbrDir24+"' />"+"</td><td align='center'>"
+ "<a href=" + item.properties.resOrgWebsite + " " + "target=" + "'_blank'" + ">"+"<img src='images/icons/explorerPng.png' width='16' height='16' title='Open link'/>" + "</a>" + "</td><td>"
+ "<a href=# onclick='showPoint(" + item.properties.id + ")'>show</a>" + "</td></tr>";
}
);
document.getElementById("fieldstbody").innerHTML = tbody;