Wie, um text hinzuzufügen, textarea, wenn der Benutzer auf eine Schaltfläche klickt

Möchte ich hinzufügen, text in textarea, wenn der Benutzer auf eine Schaltfläche klickt.Ich weiß, wie ich concate string und fügen Sie es zu der textarea, aber das, was ich will, ist das hinzufügen von text zu der Stelle/position innerhalb textarea, wo der Benutzer klickt und dann fügen Sie text an dieser position auf der Schaltfläche.

Vielen Dank im Voraus

  • wie oben erwähnt habe ich concating string auf den button klicken Sie mit bereits vorhandenen text in textarea.
  • ich muss hinzufügen von text, den der Benutzer geklickt position innerhalb textarea
  • Wo ist Sie den code Kumpel?
  • Ich denke, das ist, was Sie versuchen, zu bekommen unter: stackoverflow.com/questions/1064089/...
InformationsquelleAutor user2360906 | 2013-07-23
  1. 3

    Hier eine Referenz von mir:

    <script>
function input(){
    var text = "here the text that you want to input.";
    document.forms.form1.area.value = text;
}    
</script>
<form name='form1'>
    Click<input onclick='input()' type='button' value='BUTTON' id='button'><br>
    <textarea name='area'></textarea>

</form>

    dass ein Beispiel, das zeigt, wenn auf eine Schaltfläche geklickt haben, wird eine Zeile mit text Hinzugefügt textarea.
    warum ich fügte hinzu, javascript drin? da die html-Attribute nur ist nicht genug, um es zu machen.

    möge es helfen 😀

    • Dies löscht den text auch, da es nicht daran anfügen.
    • Wenn Sie möchten, fügen Sie den neuen text ein, setzen Sie einfach den aktuellen text in der textarea in eine variable und dann mischen Sie es mit Ihrem neuen text
    InformationsquelleAutor Oki Erie Rinaldi
  2. 1

    Müssen Sie zum hinzufügen von text zu einer bestimmten position (an der position der Einfügemarke) in das Textfeld ein, wenn Sie auf eine Schaltfläche klicken. Versuchen Sie Folgendes:

    JS:

    var position;
	
    function getCaretPosition() {
        var ctlTextArea = document.getElementById('textArea');
        position = ctlTextArea.selectionStart;
        return position;
    }
	
	/* Needs JQuery */
    $(document).ready(function () {

        jQuery.fn.extend({
            insertAtCaret: function (myValue) {
                return this.each(function (i) {
                    if (document.selection) {
                        //For browsers like Internet Explorer
                        this.focus();
                        sel = document.selection.createRange();
                        sel.text = myValue;
                        this.focus();
                    }
                    else if (this.selectionStart || this.selectionStart == '0') {
                        //For browsers like Firefox and Webkit based
                        var startPos = this.selectionStart;
                        var endPos = this.selectionEnd;
                        var scrollTop = this.scrollTop;
                        this.value = this.value.substring(0, startPos) + myValue + this.value.substring(endPos, this.value.length);
                        this.focus();
                        this.selectionStart = startPos + myValue.length;
                        this.selectionEnd = startPos + myValue.length;
                        this.scrollTop = scrollTop;
                    } else {
                        this.value += myValue;
                        this.focus();
                    }
                })
            }
        });

        $('#btnTest').click(function () {
            $("#textArea").insertAtCaret(' << inserted text! >> ');
        });

    });

    HTML:

    <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta charset="utf-8" />
    <title>How to add text to textarea when user clicks a button</title>
</head>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>

<script>
//The javascript code goes here...
</script>

<body>
  
<h1>How to add text to textarea when user clicks a button</h1>
<div id="divDroppedFields">
    <textarea id="textArea" name="txtMessageFields" class="required" cols="80" rows="10" onclick="getCaretPosition()" onkeyup="getCaretPosition()">
	In the meantime the cat slowly recovered. The socket of the lost eye presented, it is true, a frightful appearance, but he no longer appeared to suffer any pain.
	</textarea>
</div>
<button id="btnTest">CLICK ME</button>


</body>
</html>

    InformationsquelleAutor Leonardo Hernandez
  3. 0

    hier ist ein einfacher Weg mit JQuery.

    Ihre html -

    <textarea id="txtarea"></textarea>
<input type="button" value="add text" id="add" />

    Ihre Jquery

    $(document).ready(function(){
  $("#add").click(function(){
      $('#txtarea').html('test');
  });
});

    können Sie in Aktion sehen Sie hier

    • Was ist, wenn Sie hinzufügen möchten 2 Absätze? wie würden Sie sich übergeben, HTML-Code in die?
    • versuchen $('#txtarea, #txtarea2').html('test');
    InformationsquelleAutor da-hype
Schreibe einen Kommentar