2017-03-02 7 views
-1

Der Zweck des Codes ist, wenn die Buchstaben aus dem Array angeklickt werden, sollten sie in das Textfeld angezeigt werden. Das Array besteht aus Buchstaben wie eine Tastatur. Ich habe es versucht, aber ich weiß nicht, was ich falsch mache. Kann mir bitte jemand helfen?Hinzufügen von Text zu TextBox bei Klick

<html> 

    <head> 

    <body> 
    <textarea id="Alltext"></textarea> 
     <div id = "playground"> 


     </div> 

    </body> 




    <script> 

     var Item = function(name){ 

      this.name = name; 
      var div = document.createElement("div"); 

      div.className = ""; 
      div.innerHTML = name; 
      this.div = div; 
      this.appendTo = function (parent){ 
      parent.append(this.div); 

      } 

      this.setName = function(newName){ 
       this.div.innerHTML = newName; 
       this.name = newName; 
      } 



      this.div.addEventListener('click', function(event){ 


       //change the color of the item for 2 seconds 
       var clickedElement = event.target; 

       clickedElement.classList.add("clicked"); 

       window.setTimeout(function(){ 
       clickedElement.classList.remove("clicked"); 


       }); 


      }); 



     } 

     var names = ["Q","W", "E", "R","T","Y", "U","I","O","P","A","S","D","F","G","H","J","K","L",]; 
     var playground = document.getElementById("playground"); 

     for(var i = 0; i < names.length; i++){ 

      var myItem = new Item(names[i]); 
      myItem.appendTo(playground);    


      } 


    </script> 
</html> 
+1

nicht sicher, was dieser Teil des Codes verzögern wollen, ist alles über 'Variable ein = this;' nicht wie jede gültige Javascript sieht die ich je habe gesehen. Wahrscheinlich mehr Probleme als das, aber Sie müssen das beheben. – chairmanmow

Antwort

0

sollte dieser Code funktionieren:

<script> 

    var Item = function(name){ 

     this.name = name; 
     var div = document.createElement("div"); 

     div.className = ""; 
     div.innerHTML = name; 
     this.div = div; 
     this.appendTo = function (parent){ 
     parent.append(this.div); 

     } 

     this.setName = function(newName){ 
      this.div.innerHTML = newName; 
      this.name = newName; 
     } 



     this.div.addEventListener('click', function(event){ 

      //change the color of the item for 2 seconds 
      var clickedElement = event.target; 
      var value = document.getElementById('Alltext').value; 
      var newValue = value+event.target.innerText; 
      document.getElementById('Alltext').value=newValue; 

      clickedElement.classList.add("clicked"); 

      window.setTimeout(function(){ 
      clickedElement.classList.remove("clicked"); 


      }, 2000); 


     }); 



    } 

    var names = ["Q","W", "E", "R","T","Y", "U","I","O","P","A","S","D","F","G","H","J","K","L",]; 
    var playground = document.getElementById("playground"); 

    for(var i = 0; i < names.length; i++){ 

     var myItem = new Item(names[i]); 
     myItem.appendTo(playground);    


     } 


</script> 

I Timeout hinzugefügt und Code erforderlichen Wert das Textfeld hinzuzufügen.

SetTimeout muss angeben, wie lange die Funktion window.setTimeout(function(){},2000); //2000 means 2 seconds delay

+0

@Umar lassen Sie mich wissen, wenn es ein Problem gab. – alireza

+0

Das hilft Danke – Umar

0

Ich denke, Ihre <textarea> sollte in <body> Tag platziert werden ... Ihr Code sein kann aufgrund anderer Probleme nicht funktioniert, aber dies sollte festgelegt werden müssen.

+0

Ich habe das getan. – Umar

0

Ihr erstes Problem ist wahrscheinlich mit den this Referenzen im setTimeout, die in diesem Fall an das Fenster gleich ist (oder undefined im Strict-Modus), anstatt das Objekt, das Sie erwarten, dass es zu sein.

variable one=this; ist nicht korrekt deklariert.

Alltext sollte in einer " zitiert werden; Andernfalls versucht es, auf eine Variable mit diesem Namen zu verweisen, die nicht existiert.

Es gibt eine Reihe von Problemen mit diesem Code dieser Art. Ich empfehle dringend, die fragliche Seite in Ihrem Browser zu öffnen und den Code in den Devtools zu prüfen, der Ihnen die meisten dieser Fehler im Voraus zeigen sollte. Von dort aus können Sie sich durch die Codeabschnitte arbeiten, die nicht so funktionieren, wie Sie es erwarten.

+0

Ich habe den ganzen Satz Code entfernt, den ich eingegeben habe, um Text in den Textbereich einzufügen, Kannst du mir zeigen, wie es geht? Danke – Umar

Verwandte Themen