jquery Toggle tut nicht

Habe mir folgende Funktionalität ergoogelt: ..... Jetzt möchte ich das abgewandelt einsetzen: .... Und das funktioniert nicht. Also der Plan wäre, dass die zweite TR Zeile ein und ausgeblendet wird, zu Anfang definitiv ausgeblendet ist. Ist das display:none hier der falsche Weg? Muss da irgendwie onload='this.hide();' hin? BTW: mit der id="form6" kann ich nur bedingt arbeiten, die ändert sich ständig, liegt in dieser Zeile aber als Variable vor. Und dass das Formular noch unvollständig ist, weiß ich

Der hier verwendete Code

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <style> html { text-align:center; } button { margin-top: 100px; padding: 10px 30px; color: #FFF; background-color: #db5757; box-shadow: 0px 17px 10px 7px rgba(0, 0, 0, 0.4); border: solid 3px #db5757; border-radius: 5px; font-size: 30px; } </style> <b>Arbeitsschritte</b><table width="95%"> <tr class="tabletr" style="color: #000;"> <td>Telefonanlage</td> <td>in der PBX Nebenstelle einrichten</td> <td><button><img class="aufzu" src="erweitern.png" alt="aufklappen und bearbeiten" /></button></td> </tr> <tr class="tabletr" id="form6" style="height: 0;"> <td colspan="3" valign="top"> <div class="trslide"> <form id="stepfertig" action="/_BR-Project/index.php?action=project&do=details&id=2&stepfertig=1&tid=4" method="post"> <table> <tr id="" valign="top"> <td><small>FN? SIP? Durchwahl:</small><br/><input type="text" name="ergebnis" size=30 maxlength=100 required /></td> <td><small>Bemerkung</small><br/><textarea name=\"bemerkung\" rows="4" cols="40" ></textarea></td> <td><button><img alt="fertigstellen und speichern" src="ok.png"></button></td> </tr> </table></form> </div> </td> </tr> <tr class="tabletr" style="color: #000;"> <td>Telefonanlage</td> <td>in der PBX Nebenstelle einrichten</td> <td><button><img class="aufzu" src="erweitern.png" alt="aufklappen und bearbeiten" /></button></td> </tr> <tr class="tabletr" id="form6" style="height: 0;"> <td colspan="3" valign="top"> <div class="trslide"> <form id="stepfertig" action="/_BR-Project/index.php?action=project&do=details&id=2&stepfertig=1&tid=4" method="post"> <table> <tr id="" valign="top"> <td><small>FN? SIP? Durchwahl:</small><br/><input type="text" name="ergebnis" size=30 maxlength=100 required /></td> <td><small>Bemerkung</small><br/><textarea name=\"bemerkung\" rows="4" cols="40" ></textarea></td> <td><button><img alt="fertigstellen und speichern" src="ok.png"></button></td> </tr> </table></form> </div> </td> </tr> <tr class="tabletr" style="color: #000;"> <td>Telefonanlage</td> <td>in der PBX Nebenstelle einrichten</td> <td><button><img class="aufzu" src="erweitern.png" alt="aufklappen und bearbeiten" /></button></td> </tr> <tr class="tabletr" id="form6" style="height: 0;"> <td colspan="3" valign="top"> <div class="trslide"> <form id="stepfertig" action="/_BR-Project/index.php?action=project&do=details&id=2&stepfertig=1&tid=4" method="post"> <table> <tr id="" valign="top"> <td><small>FN? SIP? Durchwahl:</small><br/><input type="text" name="ergebnis" size=30 maxlength=100 required /></td> <td><small>Bemerkung</small><br/><textarea name=\"bemerkung\" rows="4" cols="40" ></textarea></td> <td><button><img alt="fertigstellen und speichern" src="ok.png"></button></td> </tr> </table></form> </div> </td> </tr> <script> $(document).ready(function() { $("img.aufzu").click(function() { $(this).closest("tr").next("tr").slideToggle(); }); }); $(document).ready(function () { $("img.aufzu").click(function () { $(this).closest("tr").next("tr").find(".trslide").slideToggle(); }); }); </script>

Add Comment

* Required information
1000
Drag & drop images (max 3)
Powered by Commentics

Comments

No comments yet. Be the first!