2016-11-30 4 views
1

So versuchen im, Worte in meinem Textbox wie folgendes Beispiel eingegeben anzuzeigen: (Thomas) würde als = „t, th, tho, thom, Thoma, thomas anzeigen ". Was gebe ich in charAt ein, um das zu ermöglichen? oder muss ich etwas anderes hinzufügen? Danke im Voraus! Javascript- Anzeige Wörter mit charAt einen Buchstaben + einen Buchstaben und so weiter

<head> 
    <meta charset="utf-8"> 

<script> 

    function printit() 
    { 
    var temptext = document.getElementById("mytext").value; 
    var tempa = temptext.charAt(); 
    document.getElementById("translated").innerHTML=tempa; 

    } 

</script> 


</head> 


<body> 
    <h1> </h1> 

<form name="f1"> 
<input type="text" id="mytext" value="" /> 
<input type="button" value="print" onclick="printit()"/> 

</form> 
<div id="translated" style="background-color:gray"></div> 

</body> 


</html> 
+1

[ 'substring'] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substring) innerhalb einer [loop] (https: //developer.mozilla .org/de-DE/docs/Web/JavaScript/Referenz/Statements/für) wäre einfacher. – Teemu

+0

@ Teemu in der Tat :) – xShirase

Antwort

1

Eine Lösung ES6 Array.from und String#slice Methoden.

<script> 
 
    function printit() { 
 
    var temptext = document.getElementById("mytext").value; 
 
    document.getElementById("translated").innerHTML = Array.from({ 
 
     length: temptext.length 
 
    }, (v, i) => temptext.slice(0, i + 1)).join(); 
 

 
    } 
 
</script> 
 

 

 
<form name="f1"> 
 
    <input type="text" id="mytext" value="" /> 
 
    <input type="button" value="print" onclick="printit()" /> 
 

 
</form> 
 
<div id="translated" style="background-color:gray"></div>


Mit Array#map und String#split Methoden.

<script> 
 
    function printit() { 
 
    var temptext = document.getElementById("mytext").value; 
 
    document.getElementById("translated").innerHTML = temptext.split('').map(function(v, i) { 
 
     return temptext.slice(0, i + 1) 
 
    }).join(); 
 

 
    } 
 
</script> 
 

 

 
<form name="f1"> 
 
    <input type="text" id="mytext" value="" /> 
 
    <input type="button" value="print" onclick="printit()" /> 
 

 
</form> 
 
<div id="translated" style="background-color:gray"></div>

1

eine einfachere Lösung:

function writemore(){ 
 
    var a = document.getElementById("mytext").value; 
 
    var out = []; 
 
    for(var i=1;i<a.length+1;i++){ 
 
     out.push(a.substring(0,i)); 
 
    } 
 
    document.getElementById("translated").innerHTML = out.join(','); 
 
};
<form name="f1"> 
 
    <input type="text" id="mytext" value="" /> 
 
    <input type="button" value="print" onclick="writemore();" /> 
 

 
</form> 
 
<div id="translated" style="background-color:gray"></div>

0

Sie können Array.prototype.map und String.prototype.slice verwenden das erwartete Ergebnis zu erzeugen.

function printit(){ 
 
    var text = document.getElementById('mytext').value; 
 
    document.getElementById("translated").innerHTML = text.split('').map(function(v, i){ return text.slice(0, i + 1)}).join(', '); 
 
}
<h1> </h1> 
 

 
<form name="f1"> 
 
    <input type="text" id="mytext" value="" /> 
 
    <input type="button" value="print" onclick="printit()" /> 
 

 
</form> 
 
<div id="translated" style="background-color:gray"></div>

0
If you want to display "t, th, tho, thom, thoma, thomas" you should to store your position of charAt(position+1) and make for condition.., so : 

t : 0==> display = display + ", "+ charAt(position+1) 
th : 1==> display = display + ", "+ charAt(position+1) 
tho: 2 ==> display = display + ", "+ charAt(position+1) 
0

einfachste Weg, wenn Sie sich mit charAt gesetzt sind, wäre dies:

var outputString = "", inputString = "Thomas", i = -1, inputLength = inputString.length 

while(++i < inputLength){ 
    outputString += inputString.charAt(i) 
    console.log(outputString) 
} 

Wenn es wörtlich „t, th drucken muss, tho, thom, Thoma, Thomas“und nicht eine Folge von Protokollen, würde diese Version erreicht, dass

var outputString = "", outputArray = [], inputString = "Thomas", i = -1, inputLength = inputString.length 

while(++i < inputLength){ 
    outputString += inputString.charAt(i) 
    outputArray.push(outputString) 
} 


console.log(outputArray.join(", ")) 
Verwandte Themen