I have learned in class how to make a function that generates all combinations of an inputted word. However, how to make it so that instead of a windowed prompt or alert popping up to enter the word and shows all combination on the prompt box, I want to display the result on the screen itself. How would i do that through the code i have already written?
This is my complete code:
<!DOCTYPE html>
<html>
<title>Combinations of a Word</title>
<body>
<script>
function combinations(str){
var substr = [];
for (var x = 0; x < str.length; x++)
{
for (var y = x + 1; y <= str.length; y++)
{
substr.push(str.substring(x,y));
}
}
return substr;
}
document.write(combinations(window.prompt("Please enter a word")));
</script>
</body>
</html>
Simply
<input type="text" id="word"/>
<div id="comb"></div>
JavaScript
function combinations(str) {
var substr = [];
for (var x = 0; x < str.length; x++) {
for (var y = x + 1; y <= str.length; y++) {
substr.push(str.substring(x, y));
}
}
return substr;
}
var input = document.getElementById('word');
var out = document.getElementById('comb');
input.addEventListener('keyup', function(e){
out.innerHTML = combinations(this.value).join(',');
});
FIDDLE
PS - your combinations code is wrong
Related
<p>hi</p>
<p>hello</p>
<p>hi</p>
<script>
var arr = document.getElementsByTagName("p");
for (var x = 0; x < arr.length; x++) {
arr[x].innerHTML = "Hi there";
}
</script>
<p>hi</p>
<p>hello</p>
<p>hi</p>
<script>
var arr = document.getElementsByTagName("p").length;
for (var x = 0; x < arr; x++) {
arr[x].innerHTML = "Hi there";
}
</script>
Why doesnt the second method work?
Is there a limit on the number of methods you can add on a single object?If there isn't, how do you prioritise the methods?
in second :
var arr = document.getElementsByTagName("p").length;
this length of elements...
and:
for (var x = 0; x < arr.; x++)
arr.;???
Change like first example and all works fine..
No, there is no limit for the number of methods, therefor, you are setting the property text of a tag, not adding properties to it.
Even further:
for (var x = 0; x < arr.; x++)
You probably nedded :
for (var x = 0; x < arr.lenght; x++)
I'm learning JS on in school and this task is a homework and its killing me.
I need to create an input field and two buttons. The first button needs to create given number of input elements based on the first input value, second button should take all the values from new inputs and sum it.
I simply can't get the value from new input fields, i can't move from this point for week now and everything i've read didn't helped. This is the code i made so far, remember that im a complete beginner and this task is really important for me.
function myFunction() {
var i = document.getElementById("input1").value;
for (var j = 1; j <= i; j++) {
var inp = document.createElement("INPUT");
document.body.appendChild(inp);
}
}
function myFunction2() {
var arr = document.getElementsByTagName("INPUT");
for (var i = 0; i < arr.length; i++) {
var ar = document.getElementsByTagName("INPUT").value;
arr[i] = parseInt(ar);
}
for (var i = 1; i < arr.length; i++) {
var sum = sum + arr[i];
}
document.getElementById("test").innerHTML = sum;
}
<input id="input1"></input><br>
<button onclick="myFunction()">dodaj</button>
<button onclick="myFunction2()">saberi</button><br>
<p id="test"></p>
Thanks in advance
Update your myFunction2 :
function myFunction2() {
var arr = document.getElementsByTagName("INPUT");
var sum = 0;
for (var i = 0; i < arr.length; i++) {
var ar = document.getElementsByTagName("INPUT")[i].value;
sum = sum + parseInt(ar);
}
document.getElementById("test").innerHTML = sum;
}
You dont need the for loop again. Lets declare variable sum and add value into this.
If you don't want to add value from first input, start for loop from 1.
Read back this line carefully:
document.getElementsByTagName("INPUT").value`
It says "get elements", so there is more than one element, but then you ask for "value", so a single value; how does the browser know which of the values you want?
You already ran this function, and put the result in arr, and you're looping over it, with the counter i. So that's where you want to get your value from.
You then reuse that variable to put the numbers into; that's a bad idea, and a temptation you wouldn't have had if you'd chosen better variable names, like listOfInputElements and listOfValues.
You need to add specific class to the newly created inputs because document.getElementsByTagName("INPUT") returns collection with your #input1.
Here is a code:
<!DOCTYPE html>
<html>
<head>
<title>Sabiranje</title>
</head>
<body>
<p>Unesite izabrani broj clanova niza</p>
<input id="input1"></input><br>
<button onclick="myFunction()">dodaj</button>
<button onclick="myFunction2()">saberi</button><br>
<p id="test"></p>
<script>
function myFunction(){
var i = document.getElementById("input1").value;
for (var j=1; j<=i; j++){
var inp = document.createElement("INPUT");
inp.className = 'new-inp';
document.body.appendChild(inp);
}
}
function myFunction2(){
var arr = document.getElementsByClassName("new-inp");
var sum = 0;
for (var i = 0; i < arr.length; i++){
sum += parseFloat(arr[i].value);
}
document.getElementById("test").innerHTML = sum;
}
</script>
</body>
</html>
I fix your code but it could be wrote much better.
You had some logic issue in myFunction2(). Take care when you want to sum all inputs value to not include #input1. I addeded the class generated-input on generated inputs so they can be fetched separately.
function myFunction() {
var i = document.getElementById("input1").value;
for (var j = 1; j <= i; j++) {
var inp = document.createElement("input");
inp.className = 'generated-input';
document.body.appendChild(inp);
}
}
function myFunction2() {
var arr = document.querySelectorAll(".generated-input");
var sum = 0;
for (var i = 0; i < arr.length; i++) {
sum += parseInt(arr[i].value);
}
document.getElementById("test").innerHTML = sum;
}
<input id="input1"></input><br>
<button onclick="myFunction()">dodaj</button>
<button onclick="myFunction2()">saberi</button><br>
<p id="test"></p>
I tried to make a code that returns many "9" characters to a string according to an int value.
Ej.: If "y" is equal to 5, "w" should return "99999".
I used the "for" instruction, but it makes the tab freeze.
The code:
var w = "";
var y = "";
function Calc()
{
x = document.getElementById("inputX").value;
y = document.getElementById("inputY").value;
for (var i; i = y.length; i++)
{
w += 9;
}
}
Thanks! (and sorry for my bad english).
I have updated your code. I have changed the condition in the for loop and and initialized i variable.
function Calc()
{
var w = "";
var y = "";
x = document.getElementById("inputX").value;
y = document.getElementById("inputY").value;
for (var i = 0; i < y.length; i++)
{
w += 9;
}
console.log(w);
}
X : <input type="text" id="inputX"><br>
Y : <input type="text" id="inputY"><br>
<button type="button" onclick="Calc()">Calculate</button>
I am making a program that has an array of numbers and then the user inputs some values in and clicks on verify. the value he enters has to be in order with the array of numbers and if it isn't the user gets an alert message sorry HOWEVER the value inside the first input bar decides from which number of the array should the comparison should start. FOR example, if the array holds numbers like {2,4,6,8,10}
and the user enters 6 in the first input bar and then he enters 8 and 10 in the next two bars, he should get the result "678" HOWEVER if he doesn't get the first number right lets say he enters 3, and since 3 isn't in the array, then it doesn't matter what he enters in the other input bars, he would get the result "Sorry". similarly, if the user types 4 in the first input bar but then then in the second bar he types 8, he should still get the result "Sorry" since the order of the array is {4,6,8} not {4,8}.. Now, i made a program but the thing is, whenever i click on the verify button, nothing happens :/.. here are my codes. and here is also the result i am getting: https://jsfiddle.net/53j19rpt/
<html>
<head>
</head>
<script type="text/javascript">
var arr = [];
var t;
var num = 2;
var x = [];
for (var x = 0; x < 4; x++) {
document.getElementById("one" + x);
}
function go() {
for (var t = 0; t < 4; k++) {
x[t] = num * (t + 1);
}
for (var k = 0; k < 4; k++) {
if (document.getElementById("one0").value >= x[k])
if (document.getElementById("one" + k).value == x[k])
document.write(document.getElementById("one" + k).value);
else
document.write("Sorry");
}
}
</script>
<body>
<input id="one0" type="text">
<input id="one1" type="text">
<input id="one2" type="text">
<input id="one3" type="text">
<input type="button" id="verifyBtn" value="verify" onclick="go()">
</body>
</html>
check this
for (var t = 0; t < 4; k++) {
x[t] = num * (t + 1);
}
Code is going for an infinite loop here. the value of t is not getting incremented in the code.
There are multiple issues here:
x first gets declared as an array (i.e. var x = [];, but then immediately after that, x gets used as an iterator for the for loop (i.e. for (var x = 0; x < 4; x++) {). Later on in the start of function go(), when assigning values to x, it attempts to access x[t], which does not work for an integer. So use a different variable in the iterator:
for (var x = 0; x < 4; x++) {
document.getElementById("one" + x);
}
In the second for loop, the variable t doesn't get incremented, which causes an infinite loop. Increment t, not k.
for (var t = 0; t < 4; t++) {
The if statements have no braces, which causes only the next line to be executed... though the two if statements in sequence will still execute the statement after the second if when both conditions evaluate to true. If you need multiple lines of code after the if expression then wrap them in curly braces.
See the example below:
var arr = [];
var t;
var num = 2;
var x = [];
for (var h = 0; h < 4; h++) {
document.getElementById("one" + x);
}
function go() {
for (var t = 0; t < 4; t++) {
x[t] = num * (t + 1);
}
for (var k = 0; k < 4; k++) {
if (document.getElementById("one0").value >= x[k]) {
if (document.getElementById("one" + k).value == x[k]) {
document.write(document.getElementById("one" + k).value);
}
else {
document.write("Sorry");
}
}//could have an else after this when one0's value is less than x[k]
}
console.log('done with function go()');
}
<input id="one0" type="text">
<input id="one1" type="text">
<input id="one2" type="text">
<input id="one3" type="text">
<input type="button" id="verifyBtn" value="verify" onclick="go()">
For some odd reason that I can't figure out, the code won't work when I have these if/else statements inside it, it works fine when they aren't there. I assume it's something to do with the condition I've attached to the if/else statements, as when simpler conditions are used it seems all right. Can someone please tell me what I'm doing wrong?
function wordSplit(){
var sentence = document.getElementById("two").value;
var userWords=sentence.split(" ");
while(t<userWords.length){
alert(userWords[t]);
t++
};
x = 0;
for (var x = 0; x < userWords.length; x++){
y = 0;
for (var y = 0; y < vocab.length; y++){
if (y<vocab.length) {
y++
};
else if (vocab[y] == userWords[x]){
y = 0;
x++
};
else if(y<vocab.length) {
y++
};
else if (y == vocab.length){
y = 0;
};
else if (y == 0)
{
vocab.push(userWords[x]);
x++
};
};
};
};
To reiterate, as far as I can tell the problem is definitely in that if else section, as when it is removed or altered to be a lot simpler, it suddenly works.
#DCoder is correct, you need to drop the extra ;
HTML:
<input type="text" id="two" value="What the hell is wrong here??" />
JavaScript:
wordSplit();
function wordSplit() {
var vocab = [];
var sentence = document.getElementById("two").value;
var userWords = sentence.split(" ");
var t = 0;
while (t < userWords.length) {
alert(userWords[t]);
t++
};
x = 0;
for (var x = 0; x < userWords.length; x++) {
y = 0;
for (var y = 0; y < vocab.length; y++) {
if (y < vocab.length) {
y++
} else if (vocab[y] == userWords[x]) {
y = 0;
x++
} else if (y < vocab.length) {
y++
} else if (y == vocab.length) {
y = 0;
} else if (y == 0) {
vocab.push(userWords[x]);
x++
}
}
}
}
Fixed Live Demo