Javascript - Einfügen bestimmter Text in Textarea auf Schaltfläche klicken

Question

ich neu in Javascript. Ich arbeite an meinem Django-Projekt und möchte einige Buttons wie die img-Taste hinzufügen. Hier ist Beispiel:

Also, wenn Benutzer img Schaltfläche klicken in Textfeld den Text hinzugefügt werden:

<img src="[YOUR IMAGE]"> 

Vielen Dank für Hilfe.

Answer 1

Wenn ich Ihre Frage richtig verstehe, müssen Sie eine Funktion in Javascript aufrufen, um auf Ihr spezifisches Element zu schreiben und auf Ihrem Bild verwenden Sie einen onclick.

so etwas wie:

onclick="document.location=this.id+'.html' 

Probe:

$(function(){ 
    var $display = $('#display'); 
    $display.val(0); 

    $(document).on('click', 'button.number', function(){ 
     if($display.val() != 0) { 
      $display.val($display.val() + $(this).val()); 
     } else { 
      $display.val($(this).val()); 
     } 

    }); 
}); 

JS Fiddle-Link: http://jsfiddle.net/qohdjovu/

Dies wurde wahrscheinlich bereits hier beantwortet: Using jQuery to click the button and display the value of the button

Script Funktion gemacht wurde: @R. Canser Yanbakan

Answer 2

Sie brauchen mehr als ein Bild, wenn Sie es nicht bereits wissen. Ich schlage vor, Glyphicons zu diesem Zweck zu verwenden, alles zu vereinfachen und leichter zu sein.

Angenommen, wir verwenden die Fontawesome-Glyphen.

Bar oben Textbereich erstellen, wo Sie Ihre Kontrollen, halten werde

<section> 
     <i id="control-bold" class="fa fa-bold" aria-hidden="true"></i> 
     <i id="control-italic" class="fa fa-italic" aria-hidden="true"></i> 
    </section> 
<textarea id="textarea"></textarea> 

Der Einfachheit halber habe ich ids auf die Schaltfläche Bedienelemente und JQuery verwenden zu hören Ereignisse klicken, um es noch mehr zu machen einfach.

$("#control-bold").click(function(){ 
    // Bold was clicked append {bold} to text area with whatever.. 
    $("#textarea").append("{bold}"); 
}); 

$("#control-italic").click(function(){ 
    // Italic was clicked append {bold} to text area with whatever.. 
    $("#textarea").append("{bold}"); 
}); 

Hinweis: Dies ist ein einfaches & einfaches Beispiel für den Einstieg. Glyphicons und JQuery sind nur mein Vorschlag für diese Frage.

Answer 3

Wenn Sie nach einer Möglichkeit suchen, Ihren Button-Stil zu ändern, schlage ich vor, dass Sie CSS anstelle von HTML-Tags verwenden.

• eine CSS-Klasse/ID für nicht ausgewählte Schaltfläche mit dem Standard background-image
• eine CSS-Klasse/ID, die Überschreibung background-image oder ausgewählte Tasten

Und Sie werden hinzufügen/javascript element.classList.add('.selected') oder element.classList.remove('.selected') mit Klassen entfernen