OnClick-Event löst einfach aus

  • JavaScript

Es gibt 1 Antwort in diesem Thema. Der letzte Beitrag () ist von Agita.

    OnClick-Event löst einfach aus

    Hallo,
    folgender Code:

    HTML-Quellcode

    1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <title>Startliste</title>
    5. <link rel="stylesheet" href="style.css" />
    6. <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    7. <link rel="stylesheet" href="jquery.css" />
    8. <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    9. <script>
    10. var date = new Date();
    11. var flugnummer = "0";
    12. var departures = [""];
    13. var landings = [""];
    14. function ChangeStarttype() {
    15. if(document.getElementById('form-starttype').value == 'F-Schlepp') {
    16. document.getElementById('form-starttype').value = 'Windenstart';
    17. } else {
    18. document.getElementById('form-starttype').value = 'F-Schlepp';
    19. }
    20. }
    21. function ChangeTrainingperformance() {
    22. if(document.getElementById('form-trainingperformance').value == 'Schulungsflug') {
    23. document.getElementById('form-trainingperformance').value = 'Leistungsflug';
    24. } else {
    25. document.getElementById('form-trainingperformance').value = 'Schulungsflug';
    26. }
    27. }
    28. function ActionformOpen() {
    29. document.getElementById('action-bar').style.height='100%';
    30. document.getElementById('action-button').style.opacity='0';
    31. document.getElementById('action-button').style.display='none';
    32. document.getElementById('action-form').style.display='block';
    33. document.getElementById('action-form').style.opacity='1';
    34. }
    35. function ActionformClose() {
    36. document.getElementById('action-bar').style.height='0%';
    37. document.getElementById('action-button').style.opacity='1';
    38. document.getElementById('action-button').style.display='block';
    39. document.getElementById('action-form').style.display='none';
    40. document.getElementById('action-form').style.opacity='0';
    41. }
    42. function AddFlight() {
    43. //Flugnummer erhoehen
    44. flugnummer++;
    45. //Tabelle auswaelen
    46. var table = document.getElementById("main");
    47. //Reihe in Tabelle einfuegen
    48. var row = table.insertRow(flugnummer);
    49. row.className = "main-flight-active";
    50. row.id = "f" + flugnummer
    51. //Erste Kullumne einfuegen
    52. var flugnummerRow = row.insertCell(0);
    53. flugnummerRow.id = "main-flight-number";
    54. flugnummerRow.innerHTML = flugnummer;
    55. //Zweite Kulummne einfuegen
    56. var pilotRow = row.insertCell(1);
    57. pilotRow.id = "main-flight-pilot";
    58. pilotRow.innerHTML = document.getElementById("form-pilot").value;
    59. //Dritte Kulummne einfuegen
    60. var passengerRow = row.insertCell(2);
    61. passengerRow.id = "main-flight-passenger";
    62. passengerRow.innerHTML = document.getElementById("form-passenger").value;
    63. //Abflugzeit eintragen
    64. var d = new Date();
    65. departures.push(d);
    66. //Flug-hinzufügen-menü schliessen
    67. ActionformClose();
    68. row.onclick = EndFlight(this.rowIndex + 1);
    69. }
    70. function EndFlight(nummer) {
    71. document.getElementById("f" + nummer).className = "main-flight-deactive";
    72. }
    73. $(function() {
    74. var mitglieder = [
    75. "Mister Zensus"
    76. ];
    77. var kennzeichen = [
    78. "D-0007",
    79. "D-1111",
    80. "D-KKKK"
    81. ];
    82. var flugzeugmuster = [
    83. "ASK 21",
    84. "LS4",
    85. "Falke SF25C"
    86. ];
    87. $( "#form-pilot" ).autocomplete({
    88. source: mitglieder
    89. });
    90. $( "#form-passenger" ).autocomplete({
    91. source: mitglieder
    92. });
    93. $( "#form-license" ).autocomplete({
    94. source: kennzeichen
    95. });
    96. $( "#form-airplane" ).autocomplete({
    97. source: flugzeugmuster
    98. });
    99. });
    100. </script>
    101. </head>
    102. <body>
    103. <table id="main">
    104. <tr class="main-header">
    105. <th id="main-number">Nr.</th>
    106. <th id="main-pilot">Pilot</th>
    107. <th id="main-passenger">Passagier</th>
    108. </tr>
    109. </table>
    110. <div id="action-bar">
    111. <div id="action-button" onclick="ActionformOpen();"></div>
    112. <div id="action-form">
    113. <h1>Flug hinzuf&uuml;gen</h1>
    114. <form id="action-form-form" action="javascript:AddFlight();">
    115. <input type="text" class="form-text" required="true" id="form-pilot" placeholder="Pilot / Flugsch&uuml;ler"></input>
    116. <input type="text" class="form-text" id="form-passenger" placeholder="Passagier / Fluglehrer"></input>
    117. <input type="text" class="form-text-half" required="true" id="form-license" placeholder="Kennzeichen"></input>
    118. <input type="text" class="form-text-half" required="true" id="form-airplane" placeholder="Muster"></input>
    119. <input type="button" class="form-select-half" id="form-starttype" onclick="ChangeStarttype();" value="F-Schlepp"></input>
    120. <input type="button" class="form-select-half" id="form-trainingperformance" onclick="ChangeTrainingperformance();" value="Schulungsflug"></input>
    121. <input type="submit" class="submitbutton" id="form-submit" value="Hinzuf&uuml;gen"></input>
    122. </form>
    123. </div>
    124. </div>
    125. </body>
    126. </html>

    Das Problem liegt darin, dass das in der Funktion AddFlight an die neue Tabellenreihe angeknüpfte OnClick-Event sich von selbst auslöst.
    Wie kann man das verhindern?

    LG
    m9898

    das hier:
    element.eventname = funcname();
    ist klar, dass es die funktion auslöst, wegen den () ..

    versuchs so:

    JavaScript-Quellcode

    1. row.onclick = function(){EndFlight(this.rowIndex + 1);};


    wobei... wieso eigentlich "this" ? die funktion wird ja nich als object benutzt...
    wenn du aber trotzdem das "this" brauchst, dann musst du ggf noch was kleines umändern...