在我的网页上,我使用此Simple Context Menu Plugin来显示一些上下文菜单,方法是右键单击某些html表格中的表格行,这些表格由Datatables Plugin制作。
现在回答我的问题。上下文菜单仅在前十行中显示在每个表上。 对我来说,似乎我没有在第一行中创建任何其他行,而不是在第十行之后的行中。
附上我网页上的一些代码:
表格示例:
<table id="datatable" class="display" cellspacing="0" width="100%"><thead><tr> <th>ID</th><th>Vorname</th><th>Nachname</th><th>Kunde</th><th>Von</th><th>Bis</th><th>Weiterbildung</th><th>Ausbilder</th><th>Achievment</th><th>Beschreibung</th><th>Zertifikat</th></tr></thead><tbody><tr class="contextmenu"><td>11</td><td>Kraemer</td><td>Test</td><td>hjadfkjas</td><td>24.06.2014</td><td>24.06.2014</td><td>test hp</td><td>Test HP</td><td></td><td>TitelDesZertifikates</td><td>TestZertifikat</td></tr><tr class="contextmenu"><td>16</td><td>ölakdsjfölk</td><td>jfdaölfjd</td><td>fneionffoefneofef</td><td>25.06.2014</td><td>25.06.2014</td><td>test hp</td><td>Test HP</td><td></td><td>adf</td><td>TestZertifikat</td></tr><tr class="contextmenu"><td>18</td><td>adfadf</td><td>adfadsf</td><td>fneionffoefneofef</td><td>25.06.2014</td><td>25.06.2014</td><td>test hp</td><td>Test HP</td><td></td><td>Test</td><td>TestZertifikat</td></tr><tr class="contextmenu"><td>19</td><td>adfadsf</td><td>afdafd</td><td>fneionffoefneofef</td><td>25.06.2014</td><td>25.06.2014</td><td>test hp</td><td>Test HP</td><td></td><td></td><td>TestZertifikat</td></tr><tr class="contextmenu"><td>20</td><td>adfadsf</td><td>Test</td><td>fneionffoefneofef</td><td>25.06.2014</td><td>25.06.2014</td><td>test hp</td><td>Test HP</td><td></td><td></td><td>TestZertifikat</td></tr><tr class="contextmenu"><td>21</td><td>adfadsf</td><td>Test</td><td>fneionffoefneofef</td><td>25.06.2014</td><td>25.06.2014</td><td>test hp</td><td>Test HP</td><td></td><td></td><td>TestZertifikat</td></tr><tr class="contextmenu"><td>22</td><td>jflajslfökj</td><td>sjdflsdkjfl</td><td>hjadfkjas</td><td>25.06.2014</td><td>25.06.2014</td><td>test hp</td><td>Name</td><td></td><td></td><td>TelefonZertifikat</td></tr><tr class="contextmenu"><td>23</td><td>Luger</td><td>Christian</td><td>hjadfkjas</td><td>26.06.2014</td><td>30.06.2014</td><td>aslökdfj</td><td>Name</td><td></td><td></td><td>TitelDesZertifikates</td></tr><tr class="contextmenu"><td>24</td><td>Meier</td><td>Hans</td><td>EPC</td><td>02.06.2014</td><td>06.06.2014</td><td>test hp</td><td>Althammer Walter</td><td>teilgenommen</td><td>irgedwas</td><td>TestZertifikat</td></tr><tr class="contextmenu"><td>25</td><td>Krämer</td><td>Sebastian</td><td>hjadfkjas</td><td>07.07.2014</td><td>07.07.2014</td><td>aslökdfj</td><td>Althammer Walter</td><td>Test</td><td>Test</td><td>Bachmann Basic Training</td></tr><tr class="contextmenu"><td>27</td><td>Kraemer</td><td>Sebastian</td><td>EPC</td><td>07.07.2014</td><td>07.07.2014</td><td>Laser Grundlagen Teil 1</td><td>Althammer Walter</td><td></td><td></td><td>Bachmann Basic Training</td></tr><tr class="contextmenu"><td>28</td><td>ecececsececec</td><td>Krämer</td><td>EPC</td><td>09.07.2014</td><td>13.07.2014</td><td>Laser Grundlagen Teil 1</td><td>Althammer Walter</td><td></td><td></td><td>Bachmann Basic Training</td></tr><tr class="contextmenu"><td>29</td><td>Sebastian</td><td>Krämer</td><td>EPC</td><td>07.07.2014</td><td>07.07.2014</td><td>Laser Grundlagen Teil 1</td><td>Sebastian Krämer</td><td></td><td></td><td>Bachmann Basic Training</td></tr><tr class="contextmenu"><td>30</td><td>Sebastian</td><td>Krämer</td><td>EPC</td><td>08.07.2014</td><td>08.07.2014</td><td>Laser Grundlagen Teil 1</td><td>Althammer Walter</td><td></td><td></td><td>Bachmann Basic Training</td></tr></tbody></table>
上下文菜单:
$(function()
{
$('.contextmenu').contextPopup({
title: 'Optionen',
items: [
{label:'Editieren', icon:'../resources/edit.ico', action:function()
{
var modalKind;
switch(parseInt($.getUrlVar('submit')))
{
case 0:
modalKind = "modalParticipant";
break;
case 1:
modalKind = "modalTrainer";
break;
case 2:
modalKind = "modalTraining";
break;
case 3:
modalKind = "modalCustomer";
break;
case 4:
modalKind = "modalCertificate";
break;
case 5:
modalKind = "modalPageUser";
break;
default:
modalKind = "modalParticipant";
break;
}
//Create cookie to store selected datas
$.cookie("dataTableInformation", modalKind + "||" + cookietext);
fillModal();
sortListsOfParticipantFormular();
$('#'.concat(modalKind)).modal('show'); }
},
{label:'Löschen', icon:'../resources/cross.png', action:function() { addOrUpdateUrlParam("entryID", entryID);} }
]
});
});
右键单击功能:
$(document).ready(function()
{
$('#datatable').DataTable();
$('#datatable tbody').on('mousedown', 'tr', function(e)
{
cookietext = "";
switch(e.which)
{
case 3: entryID = $('td', this).eq(0).text();
$(this).find('td').each (function()
{
cookietext += $(this).text() + "||";
});
break;
}
});
} );
有没有人知道为什么没有出现上下文菜单?
在尝试了一些可能性后,现在我已经看到通过上下文菜单替换一些代码, 上下文菜单显示在所有行上。新代码:
$('.contextmenu').contextPopup({
title: 'Optionen',
items: [
{label:'Editieren', icon:'../resources/edit.ico', action:function()
{
var modalKind;
switch(parseInt($.getUrlVar('submit')))
{
case 0:
modalKind = "modalParticipant";
break;
case 1:
modalKind = "modalTrainer";
break;
case 2:
modalKind = "modalTraining";
break;
case 3:
modalKind = "modalCustomer";
break;
case 4:
modalKind = "modalCertificate";
break;
case 5:
modalKind = "modalPageUser";
break;
default:
modalKind = "modalParticipant";
break;
}
//Create cookie to store selected datas
$.cookie("dataTableInformation", modalKind + "||" + cookietext);
fillModal();
$('#'.concat(modalKind)).modal('show'); }
},
{label:'Löschen', icon:'../resources/cross.png', action:function() { addOrUpdateUrlParam("entryID", entryID);} }
]
});
有没有人知道为什么新代码将上下文菜单附加到所有行而旧版本只附加到前十行?