Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
Is it possible to use a JavaScript document.getElementsByClassName variable in an if statement with event.target?
I want to achieve something like this:
var signInModals = document.getElementsByClassName("signInModal");
if (event.target == signInModals) {
alert("It worked!");
}
Thank you!
You are trying to compare an HTML collection to an element. That is never going to work. You would need to loop over the HTML Collection and check each one.
Seems like you are trying to see if an element has a class so just check for the class.
if(evt.target.classList.contains("signInModal"))
other option is to check to see if it is a parent (depending on what evt is)
if(evt.target.closest(".signInModal"))
Well, event is a reference to the Object itself, not its value. So you are saying is this Object that is clicked this Object that I got from the class name. The answer will always be false. So to answer your question yes it is, but it does not make sense to do that, you probably want to check if a property matches.
For example: when this button is clicked change the button color to the same color has this Html object, and then you can use the if statement to say if (button color == html object color) alert("It worked")
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 5 years ago.
Improve this question
Here I need to provide officename to find the address ,but one challenge which I am facing that if user does not type anything and hit search button then I want to acknowledge them to fill the req input.
I have implemented one function also that will get invocked when someone hits the search button.But I am unable to proceed for further execution.
You can do it something like this:
var searchText = document.getElementById('<ID_OF_INPUT_FIELD>').value;
if(!searchText) {
alert('Please enter something');
}
<input id =“officeInput” name=“officeiupit” size=“35”>
Point to critical input fields and save in global variables:
oOf=document.getElementById(‘officeInput’);
When a search button has been clicked, make a copy of the textbook content inside your function which you've made:
var sInputText=oOf.value;
In this case inside your function just put
if(!sInputText)
alert(“You must enter an input.“);
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
So I am trying to do a button and if you click on it then it calls a function called order(). So, If I'm trying to do something like this order("+<script>blablabla</script>+") then it shows me a error if I type into something between the "+HERE+" Why that? Is there any way around it?
You could always do something like this. Maybe change the divs around a bit and add a rounding system. This gives you a live update on the costs when selecting how many keys.
https://jsfiddle.net/8hube9ua/
Throw this under your select,
<span data-val="1.85">1.85</span> <!--How much each key is-->
then throw this into the script.
<script>
$('#suiface').change(function(){
var span = $(this).next('span');
span.text(span.data('val') * parseInt(this.value,10)) //multiplies the cost by the option selected
})
</script>
I'm not sure to understand, but why don't you write something like this ?
<button onclick="order()">Blablabla</button>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
Anyone of you knows if there is a way to increase the time before that a search starting when the user is trying to select an element from a select list by typing the name of the element, in HTML.
For example: I have a list of 100 elements, and the user wants to find the element "Adam Smith" but he is very slow and he can not type very fast in order to select the element Adam smith. Do you know if there is a way to help the user in this use case.
I can use a different component instead of the normal select in HTML, but I am working with a legacy system and I cannot change the source code too much. Anyway also JS solutions are well accepted
I think is a perfect use case for the debounce method of Lodash.
Here is a little example where the time the function will wait until fire is 500:
function doSearch () {
$('#output').html('searched: ' + $('#search').val())
}
$('#search').on('input', _.debounce(doSearch, 500));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type=text id=search />
<p id=output></p>
function doSearch () {
console.log('do search')
}
$('#search').on('input', _.debounce(doSearch, 500));
To debug and find which functions are called when a user starts typing, you can add some JavaScript at the very end on the HTML output that adds (or overrides) the original behavior.
This may help tracking down the problem and find out where that timer value is set:
document.getElementById('thatInputElement').onKeyUp = function(event)
{
console.log(event);
};
You can also achieve this directly from the dev-tools web-console in your browser, without tampering with the source-code.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I have something like this:
Vehicle Info
<script type="text/javascript">
function clickVehicleTab() {
$("#vehicle").trigger('click');
}
</script>
The function gets executed, however the jQuery to click the object doesn't seem to be executing successfully. What am I missing?
EDIT:
It appears the bind on the #vehicle object is a problem. It looks like this:
$('#jsddm > #vehicle').bind('click', openVehicleMenu); //vehicle menu click event
So the #vehicle can't be programattically clicked directly the way I'm trying.
A better way to do this would be adding an id to the link and using this to listen to the trigger event. Then when this is entered trigger the click-event on the element with the id "vehicle"
Vehicle Info
$(document).ready(function(){
$("#url").click(function(e){
e.preventDefault();
console.log('TEST: clickVehicleTab entered...');
$("#vehicle").trigger('click');
}
});
If the binding is done programatically why don't you just use:
openVehicleMenu();
instead of
$("#vehicle").trigger('click');
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
In my code (HTML and JS), I have a form with two fields; field A and field B. I want to write the JS code that will get the data from field A and use it to set the default value for field B. Can someone help me do that?
If you decompose the problem into smaller pieces, there appear to be three components:
Get value from Field A
Set value of Field B
Trigger the event
Let's start with the first one...
There are lots of ways to reference an element. Let's assume for a moment that your element has an id:
<input type="text" id="fieldA" />
Given that, we can get its value:
var valueOfFieldA = document.getElementById('fieldA').value;
Now that we have the value, let's move on to the second component...
Similar to above, all we have to do is reference the element. Once we have that, we can set its .value property just as easily as we can read it. Let's assume another id in the markup:
<input type="text" id="fieldB" />
Given that, we can set its value:
document.getElementById('fieldB').value = valueOfFieldA;
Finally, we want to trigger this. Should it be when a button is pressed? When something else happens? For now I'm going to assume it should be when the value of Field A changes, so let's attach the code to the event handler for the change event of Field A:
document.getElementById('fieldA').onchange = function () {
var valueOfFieldA = document.getElementById('fieldA').value;
document.getElementById('fieldB').value = valueOfFieldA;
};
Assuming that the elements exist at the time this code runs and that it's able to find them by their id properties, this final result should assign a function to the change event of Field A such that whenever its value changes the value is then set to Field B.