Support » Allgemeine Fragen » Tabelle durchblättern

  • tbillen89

    (@tbillen89)


    Hallo zusammen,

    ich möchte gerne von einer Tabelle nur die ersten 4 Einträge sehen und danach soll weitergeblättert werden. Das folgende Script erfüllt auch diese Anforderung:

    <!DOCTYPE html>
    <html>
    <head>
    <title>Page Title</title>

    <script>

    „use strict“;

    var page = 0;
    var maxPage = 0;
    var entryPerPage = 4;
    var entry = null;

    function right(){
    if(page < maxPage){
    page += 1;
    }
    displayNone();
    show(page);
    document.getElementById(„countPage“).textContent = page;
    }

    function left(){
    if(page > 0){
    page -= 1;
    }
    displayNone();
    show(page);
    document.getElementById(„countPage“).textContent = page;
    }

    function displayNone(){
    var i;
    for(i = 0; i < entry.length – 1; i++){
    document.getElementById(i +““).style.display = ’none‘;
    }
    }

    window.onload=function(){
    entry = document.getElementById(„table“).getElementsByTagName(‚tr‘);
    maxPage = Math.ceil((entry.length – 1) / entryPerPage) – 1;
    displayNone();
    show(0);
    };

    function show(count){
    var i;
    document.getElementById(„countPage“).textContent = count;
    for(i = (count) * entryPerPage ; i < (count + 1) * entryPerPage && i < entry.length – 1; i++){
    document.getElementById(i +““).style.display = ‚table-row‘;
    }
    }

    </script>
    </head>
    <body >
    <h1>Test</h1>
    <div id=“div_table“ >
    <table id=“table“>
    <tr>
    <th>Month</th>
    <th>Savings</th>
    </tr>
    <tr id=“0″>
    <td>January</td>
    <td>$100</td>
    </tr>
    <tr id=“1″>
    <td>February</td>
    <td>$80</td>
    </tr>
    <tr id=“2″>
    <td>March</td>
    <td>$150</td>
    </tr>
    <tr id=“3″>
    <td>April</td>
    <td>$850</td>
    </tr>
    <tr id=“4″>
    <td>May</td>
    <td>$1005</td>
    </tr>
    <tr id=“5″>
    <td>June</td>
    <td>$805</td>
    </tr>
    <tr id=“6″>
    <td>Juley</td>
    <td>$32</td>
    </tr>
    <tr id=“7″>
    <td>August</td>
    <td>$232</td>
    </tr>
    <tr id=“8″>
    <td>September</td>
    <td>$3232</td>
    </tr>
    <tr id=“9″>
    <td>October</td>
    <td>$2232</td>
    </tr>
    </table>
    </div>
    <div id=“div_button“>
    <button onclick=“left()“><<</button>
    <span id=“countPage“></span>
    <button onclick=“right()“>>></button>
    </div>
    </body>
    </html>

    Wenn ich dieses nun in meiner Worpress – Installation anwende, funktioniert dieser Code nicht. Ich habe zwar noch andere Scripte am laufen, diese greifen aber nicht auf diese Container zu.

    Viele Grüße aus dem Ruhrgebiet

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 4 Antworten - 1 bis 4 (von insgesamt 4)
  • bscu

    (@bscu)

    1. „funktioniert nicht“ ist eine denkbar schlechte Problembeschreibung
    2. Wo genau kann man sich das ansehen?
    3. Deine Frage lautet wie?

    Moderator Bego Mario Garde

    (@pixolin)

    Wenn ich dieses nun in meiner Worpress – Installation anwende, funktioniert dieser Code nicht.

    Hast du den Code als Seite eingefügt? Dann dürfte der Code „escaped“ worden sein, d.h. der Editor macht aus Sicherheitsgründen <script> die Zeichen &lt ;script&gt ;, damit User nicht mit willkürlichem Code alle Sicherheitsmeachnismen von WordPress umgehen.

    Eine hübsche Anleitung, wie du trotzdem JavaScript nutzen kannst, fndest du hier:
    https://www.wpbeginner.com/wp-tutorials/how-to-easily-add-javascript-in-wordpress-pages-or-posts/

    tbillen89

    (@tbillen89)

    Ich kann das Problem kaum beschreiben, daher ist das Beschreibung so dürftig. Ich habe aber unter folgender Adresse eine Testseite:
    http://s733129738.online.de/Bewerberportal/wordpress/alle-jobs-tb/
    Diese wurde mit dem PlugIn „All-in-One WP Migration“ von der eigentlichen Seite gespiegelt.

    Zu den den Plugins, die ich schon ausprobiert habe, zählt unter anderem „Insert Headers and Footers“. Diese fügen den Code entsprechend ein, allerdings wird der Code nicht ausgeführt (und JavaScript ist bei mir aktiviert).

    Meine Frage ist daher: Wo ich einen Fehler gemacht? (Die anderen Scripts werden ja problemlos ausgeführt)

    Moderator Bego Mario Garde

    (@pixolin)

    Im Moment wird das JavaScript im Header doppelt eingebunden, aber die Konsole gibt einen Fehler aus. Mehr kann ich da aber auch nicht zu sagen; Sorry.

Ansicht von 4 Antworten - 1 bis 4 (von insgesamt 4)
  • Das Thema „Tabelle durchblättern“ ist für neue Antworten geschlossen.