Bilder in HTML



  • Hallo zusammen, ich würde gerne in ein HTML-Dokument, viele Bilder aus einem Ordner, und jeweils einen kurzen Text zur Beschreibung, einfügen, und es ermöglichen, dass man die Bilder ancklicken kann, und die Beschreibung, mit einem einzigen Event-Händler extrahieren kann. Ich arbeite mit VS 2008/2019, Windows 7 Professional 64 Bit C# und ASP .NET. Gegoogelt habe ich schon intensiv. Weiss jemand Rat ?



  • @biter Womit hast du Probleme?

    Bilder in HTML?
    Bilder als Link?

    Wo kommen die Texte für die Bilder her?



  • Die Bilder wären in einem Ordner, die Texte in einem zweiten, mit der richtigen Reihenfolge, Entsprechung. Möglicherweise Texte und Bilder in einer MySQL Datenbank. Vielmehr Arbeit wäre es nicht, die Bilder und Texte "von Hand" in die HTML Seite einzutragen. Und eine Click-Händler Methode für jedes ImageButton. einzurichten. Aber schöner in einer Datenquelle. Eine vage Idee: Verwendung von GridView und irgendetwas mit Template ???



  • Ein ListView Steuerelement wäre von Vorteil, ich kann es aber auf dem HTML-Entwurfsformular nicht positionieren, könnte jemand helfen ? Arbeite mit dem Designer für eine Web-Anwendung ASP.NET VS2008. Es ist für diese Version im Internet beschrieben.



  • Ich möchte eine Bilddatei mit Javascript anzeigen, später mehrere von einer Datei, folgendes geht nicht: var image = document.createElement("imagebutton"); ImageButton möchte ich verwenden, weil ich noch draufclicken will. mit "img" und "src" statt "imageurl" geht der Code. Weiss jemand Rat ? Das ganze ist eine Anwendung von ASP.NET. createElement("asp:ImageButton") geht auch nicht.

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <title>Meine Seite</title>
    </head>
    <body>
    <form id="form1" runat="server">
    <div id="wrapper"></div>
    <script language="javascript" type="text/javascript">
    var divWrapper = document.getElementById("wrapper");
    var image = document.createElement("imagebutton"); // geht nicht !
    image.setAttribute("imageurl", "Rot1.png");
    divWrapper.appendChild(image);
    </script>
    </form>
    </body>
    </html>



  • ImageButton ist kein Element von HTML 5, versuche es mit Canvas ...



  • Zum Schluss noch etwas, wenn ich versuche mit VS 2019 ein Web Projekt anzulegen, erscheint zu Beginn auf dem Entwurfsfenster ein komplexes Gebilde, anstelle eines leeren Fensters. Wie komme ich zu meinem leeren Fenster ? Das obige Problem habe ich mit "addEventListener" für ein Image Element gelöst, es ist wahrscheinlich nicht üblich, dass man sich fünf mal hintereinander meldet, Entschuldigung ...



  • Nochmals, bin schon ewig auf der Suche, wie lädt man ein oder mehrere Bilder, Graphiken mit Ajax vom Server, zum Browser, mit Javascript ?



  • @biter sagte in Bilder in HTML:

    bin schon ewig auf der Suche

    irgendwas machst du falsch. Load image through Ajax?



  • Danke Swordfish, das hat geholfen. Jetzt suche ich noch danach, wie man JQuery in die HTML-Seite einbindet, ohne JQuery lokal zu installieren. Habe danach auch schon gesucht, und ein paar Links erhalten, genügt da ein Link ? Oder braucht man da mehrere ?



  • @biter sagte in Bilder in HTML:

    Jetzt suche ich noch danach, wie man JQuery in die HTML-Seite einbindet, ohne JQuery lokal zu installieren.

    Was soll lokal denn hier heißen? Lokal=Client? Falls ja, dann muss da natürlich kein jquery installiert werden.



  • Ich kenne mich da nur schlecht aus, bin noch Anfänger auf dem Gebiet, gelesen habe ich dass man auf der Client-Seite folgenden Link einbauen sollte:

    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    </head>

    aber wenn es für den Client nicht notwendig ist, dann für den Server:

    <body>
    <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    ......
    </body>

    ?



  • Mit lokal meinte ich, dass man die Bibliothek JQuery herunterlädt, unter: https://jquery.com/download/ ...



  • Was ist denn jetzt deine Frage?
    Wenn deine Seite jQuery nutzt, dann muss die natürlich auch jQuery laden.
    Aber da wird nichts installierst, sondern es wird wie jedes andere Script auch geladen. So wie du es ja auch in deinem Beispiel machst.



  • @biter bitte schaff dir ein ordentliches buch ueber web dev an, wenn du wirklich vorhast irgendwas in die richtung weiter verfolgen zu wollen...

    non-SSR javascript wird vom browser ausgefuehrt nicht auf nem server... browser == client.

    nochmal: liess dich vernuenftig in das thema rein, und probiere dich nich sinnfrei in der gegend rum.
    Wenns beim verwenden von jquery schon scheitert, sehe ich da fuer komplexere themen schwarz



  • Soweit sind meine Fragen beantwortet. Ich bin eben noch Anfänger auf dem Gebiet. Bücher habe ich mir schon angeschafft. Habe mich für ASP .NET C#, ( nicht PHP, weil ich C# schon kenne ), Javascript, Ajax und JQuery entschieden. Möchte mich nur mit grundlegenden Dingen befassen, und die ganze Sache ruhen lassen. Wollte Euch nicht nerven. Danke fürs Antworten !!!



  • Ajax kommt aus einer Era in der es "einfacher" war als XMLHttpRequests selbst zu bauen.
    Das aequivalent heutzutage ist das fetch API

    JQuery braucht heute kein mensch mehr, denn 99% der funktionalitaet sind native in allen browsern vorhanden. Das sogar halbwegs standardisiert, selbst in W$ browsern.

    Wenn du javascript lernen willst, dann mach das direkt in aktuellen versionen (ECMAScript 8 oder aufwaerts, weil async/await hauptsaechlich + syntax sugar); ein framework on top zu lernen schadet definitiv auch nicht, davon gibts mehr als genug zur auswahl.



  • Wie kann ich mit Javascript Dateien ( zB Bilder ) vom Server, im HTML-Dokument anzeigen, oder mit Javascript Dateien zum Server hochladen, wenn nicht mit JQuery ?



  • Geht das mit ECMAScript 8 ?



  • document.getElementById('whateverImage').src('someImage.png')
    

    ?
    Dazu benoetigt man keinen ECMAScript standard aus diesem jahrzehnt... das geht schon laenger


Log in to reply