Wie man DOM-Elemente erhält und die onClick-Funktionalität ändert

Entwickler
1

Hallo,

Haben Sie eine Idee, wie ich DOM-Elemente in Discourse abrufen kann, ohne setTimeout und querySelector verwenden zu müssen?
Denn im Moment mache ich Folgendes:-

setTimeout(() => {
                    var createTopicButton = document.querySelector("#create-topic");
                    if(createTopicButton)
                        createTopicButton.onclick = function (e) {
                        if (window.Moengage && window.Moengage.track_event) {
                            window.Moengage.track_event("Topic_Create_Clicked", {});
                        }
                        setTimeout(() => {
                            var topicCreate = document.querySelector("#reply-control .save-or-cancel .btn-primary")
                            topicCreate.onclick = function (e) {
                                let heading = document.querySelector('#reply-control #reply-title').value;
                                let category = document.querySelector('.select-kit-header-wrapper>.select-kit-selected-name>.name>.badge-wrapper>.badge-category>.category-name')?.innerText;
                                let desc = document.querySelector('.d-editor-textarea-column>.d-editor-textarea-wrapper textarea').value;
                                let imagePresent = desc.includes("upload://");
                                if (window.Moengage && window.Moengage.track_event && heading && category && desc) {
                                    window.Moengage.track_event("Topic_Created", {"Category":category,"Topic Name":heading,"Topic Description":desc,"Is_image_present":imagePresent});
                                }

                            }
                        },[300])

                    };
                },[500])

Wenn ich die obigen Timeouts nicht verwende, erhalte ich manchmal Null-Elemente, da das DOM noch nicht vollständig geladen ist, selbst nachdem ich dies in eine window.onload-Funktion eingefügt habe.
Mein Ziel ist es also, DOM-Elemente abzurufen und die onChange-Funktionalität zu ändern.

Jede Hilfe wäre großartig.

Danke :slight_smile:

2

Discourse ist eine vollständige EmberJS-Anwendung, daher können Sie Elemente nicht abfragen/manipulieren, als wäre es eine serverseitig gerenderte, einfache HTML-Website.

Um die Webanwendung anzupassen, können Sie die Richtlinien unter
Entwicklerhandbuch für Discourse-Themes befolgen.

1 „Gefällt mir“
3

Zusätzlich zur Betrachtung des Entwicklerhandbuchs könnten Sie einen Schritt zurücktreten und beschreiben, was Sie zu tun versuchen, anstatt Ihre vorgeschlagene Lösung.

1 „Gefällt mir“
4

Hallo Jay,

Ich habe versucht, moEngage-Analysefunktionen beim Klicken auf bestimmte Schaltflächen auf der Seite aufzurufen (z. B. „Gefällt mir“, „Kommentieren“, „Teilen“).

Ich kann dies nur tun, wenn ich Zugriff auf die onClick-Funktionalität dieser Schaltflächen habe. Gibt es ein Plugin in Discourse, das mir dabei helfen könnte?

Danke

5

Das sollten Sie in einer Theme-Komponente tun können. Ich empfehle Ihnen, mit den Entwicklerhandbüchern zu beginnen, um zu sehen, wie die Dinge funktionieren.