Trying to draw a comparison between a text box and an individual element within

I am having some difficulty comparing user-entered text in a textbox with an element in an array.

function checkUserInput()
{
    var str = imageArray[randomNumber];
    var index = str.indexOf(document.getElementById('textBox').value);
    
    if(index == -1)
    {
        alert("Incorrect Answer");
    }
    else
    {
        alert("Correct Answer");
    }
}

The user's input should either partially match the specified string in the array element and display "Correct Answer" or not match at all, resulting in displaying "Incorrect Answer".

<input type="text" id="textBox" value="">
<input type="button" value="Check" onclick="checkUserInput()">

I have included the code for the textbox and button for reference.

javascriptarrays

Answer №1

Make sure to clarify your specific requirements before proceeding. Here are some options to consider:

if (document.getElementById('textBox').value === str) {
    // When the text in the textbox matches the string
} else {
    // When there is a difference between the textbox value and the string
}

Alternatively:

if (str.indexOf(document.getElementById('textBox').value) > -1) {
    // When the string is found within the textbox value
} else {
    // When the string is not present in the textbox value
}

Or perhaps:

if (document.getElementById('textBox').value.indexOf(str) > -1) {
    // When the string from array element is contained in the textbox value
} else {
    // When the string from array element is not present in the textbox value
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Discovering common elements in two multi-dimensional numpy arrays

I recently started learning Python and I've encountered an issue. import numpy as np def find_neighbors(indexset, i,j): temp = np.array([[i-1,j],[i+1,j],[i,j-1],[i,j+1]]) for ele in temp: if ele in indexset: print(ele) ...

pythonarraysnumpy

Unable to transfer the variable name between different node modules for the purpose of using it as a chat room identifier in a socket.io application

Users are able to provide a room name, however when using module.exports in a separate file to retrieve it, the value shows as undefined. This issue likely arises from the asynchronous nature of the process. //roomcheck.js var nsp = io.of("/gameroom"); n ...

javascriptnode.jswebsocket.iobackend

The subscriber continues to run repeatedly, even after we have removed its subscription

The file brief-component.ts contains the following code where the drawer service is being called: this.assignDrawerService.showDrawer(parameter); In the file drawer-service.ts: private drawerSubject = new BehaviorSubject<boolean>(false); public ...

javascriptangularangularjstypescriptionic-framework

Zoom out the slider when scrolling

Take a look at this link and as you scroll down the page, notice how the image transitions to iPhone. Can anyone provide insight on how this effect is achieved? ...

javascriptjqueryhtmlcss

The $.Get method does not retain its value within an each() loop

When using the jQuery each() method on a DropDown select, I iterate through an li element. However, my $.get() function takes time to fetch data from the server, so I use a loading image that toggles visibility. The issue is that the each() method does not ...

javascriptjqueryajax

What could be causing the dropdownlist value not to be selected or checked while using "Select2.js"?

1-Description I have implemented a select2 filter for a dropdown list in my project. (Tools used: Bootstrap 5 & .Net 7.0 Core) When I choose a client name and click submit, an error occurs stating that the 'clientId' is null (indicating no ...

javascriptjquery-select2bootstrap-5

What is the best way to add a key to a JavaScript array while keeping it reactive in Vue.js?

If there's an array in the state: state: { users: [] }, Containing objects like: { id: 1, name: "some cool name" } To add them to the store using a mutator like users.push(user);, how can we ensure that instead of 0:{...}, it uses the ...

javascriptarraysvue.jskeyvuex

Experience the combined power of addthis, isotope, and nicescroll - all in a single

I am utilizing a WordPress template that includes a set of share buttons from AddThis. <ul class="addthis extra"> <li class="addthis-hold"> <div class="addthis_toolbox" addthis:url="<?php the_permalink( ...

javascriptjquerycssjquery-isotopeaddthis

Using Conditions in AngularJS: Choosing Between Callbacks and Promises in a Service

I am currently faced with a specific scenario where I am uncertain whether to implement a callback or a promise. As someone who is relatively new to promises and just beginning to grasp their concept, I want to avoid falling into any potential anti pattern ...

javascriptangularjscallbackangular-promise

Struggling to fetch a custom attribute from the HTML Option element, receiving [object Object] as the result instead

I've been facing a challenging issue all day. My task involves making an ajax call to a predefined JSON file and trying to save certain contents into option tags using custom attributes. However, every time I attempt to retrieve the data stored in the ...

javascriptjqueryhtmljsonajax

There was a parsing error due to encountering an unexpected reserved word 'interface' in the code, as flagged

I'm encountering an issue with my code when trying to utilize Props. The error message I'm receiving is "Parsing error: Unexpected reserved word 'interface'. (3:0)eslint". This project is being developed using next with TypeScript. Er ...

javascriptreactjstypescriptnext.js

The project is not being recognized by 'webpack' when running within it

Every time I attempt to execute 'webpack' in my project, the command line shows me this error message: 'webpack' is not recognized as an internal or external command, operable program or batch file. I have installed webpack using th ...

javascriptreactjsnpmwebpack

How to merge text (string) with date in HTML using JavaScript

I am attempting to blend a day with the phrase "this is the day" in HTML. I gave it a shot, but the concatenation didn't work as expected. ...

javascripthtml

What could be causing my mongoose array to remain empty without any values being stored in it?

Issue at Hand While I have come across several similar problems on Stack Overflow about this particular issue, none of the solutions provided seemed to work for me. I am in the process of developing a basic Forum application with two routes - one for cre ...

javascriptnode.jsmongodbmongoose

Trigger a jQuery event when a particular element has finished loading

Is there a way to globally detect when any element (such as textarea) is displayed on the page in order to perform a specific action? The element could also be added dynamically through an AJAX request. // This code snippet is just an illustration of the ...

javascriptjquery

What could be causing the malfunction of DirectionalLight in three.js?

While working on a project in three.js to create a ring, I encountered an issue with lighting. The camera setup is fine, but I'm facing difficulties with lighting. Below is my code snippet: <script src="three.js"></script> <sc ...

javascriptthree.jslight

Learn how to increase a value with each dynamically clicked button in JavaScript

Whenever I try to increment the value by clicking the like button, it seems to be increasing but not in sync with the actual button count. How can I fix this issue? index.html <div class="row"> <div class="col-md-4"> ...

javascripthtml

Having issues with the sidebar malfunctioning and unsure of the cause

<html> <head> <title></title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> I've been working on creating a sidebar for my website, but it's not functioning as expect ...

javascriptjqueryhtmlcss

Difficulty establishing a connection between NodeJS and Google Drive API

I am currently facing a challenge in my NodeJS application where I'm attempting to set up a gallery page. Despite having all the necessary configurations and connections with Google Drive API, something seems amiss when accessing the /gallery route. T ...

javascriptnode.jsgoogle-drive-apiejsgoogle-api-nodejs-client

Ensure the initial value in the dropdown menu is automatically set to the first value in VueJs

How can I set the first value of my time object as the default value for my dropdown in Vue? I want the first value to be pre-selected when a user enters the website, but currently only display the value without actually selecting it. time Object:- { &quo ...

javascriptvue.jsbootstrap-4vuejs2dropdown