Have HTML anchor simulating clicking a different element [closed] - javascript

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');

Related

Using a class name for a JavaScript 'if event.target' [closed]

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")

Custom hover popup in HTML/JS/CSS [closed]

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 2 years ago.
Improve this question
How would one be able to get a popup like the image below on hover of an element? I'm not sure what I should be adding in here apart from that I preferably don't want to use any other libraries apart from jquery. Please tell me if you need any code snippets or any more information!
Let's say you have said element above as a div on your page with an ID of 'cursor'. You can set the display value in your css to 'hidden', so it won't be displayed at first. When you hover over another element, you can trigger functions to display or hide said element:
<div id='hover-element' onmouseover='onMouseOver()' onmouseout='onMouseOut()'></div>
<div id=cursor'</div>
And then inside those functions:
function onMouseOver(element){
document.getElementById('cursor').style.display = 'block';
}
function onMouseOut(element) {
document.getElementById('cursor').style.display = 'none';
}
Try it :)

Javascript move the content of textbox to a box dynamically [closed]

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 3 years ago.
Improve this question
I want to move the content of a textbox to a Box when the ADD button is pressed as in the picture. Also, this text should be removed with an X button in the above box.
Picture
Any help is highly appreciated. Thanks in advance.
You can try this code:
// find elements
var box = $("#banner-message")
// handle click and add class
$('#add').on("click", function(){
box.append("<p>Some text <button class='text-more'>x</button></p>")
})
$("body").on('click', '.text-more', function(){
$(this).parent().remove()
})
This is a demo: https://jsfiddle.net/v24jh78b/1/
It can be done using the "click" function:
$(".addbutton").on("click", function(){
var x = $(".textbox").val();
$(".box").html(x);
})
And to remove it with the "x" button:
$(".xbutton").on("click", function(){
$(this).closest("div").find(".box").html("");
})
Let me know if it works

HTML - Calling Javascript Function with variable? [closed]

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>

How to make effect of text box value changes to a jQuery functionality [closed]

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 8 years ago.
Improve this question
I have a text box which is holding some values and it has a submit button and it also have a slider so when i am clicking the button the slider changes but i want that i will not click on that submit button,instead changing the value in the textbox wil affect the slider moving.Here is a fiddle upto what i have done
http://jsfiddle.net/dhirajbodicherla/VbM9g/1/
This is the jQuery code
var slider = $(".slider").slider({
value: 50,
animate: true
});
$('#animate').click(function(){
slider.slider('value', $('#val').val());
});
Use the Keyup method.
$('#val').keyup(function(){
slider.slider('value', $('#val').val());
});
JSFiddle
The change event is sent to an element when its value changes and keyup event is sent to an element when the user releases a key on the keyboard
I hope this would help Solution:
$('#val').keyup(function(){
slider.slider('value', $(this).val());
});
You can use the select element's change event:
$('#selectthing').change(function(){
slider.slider('value', $('#val').val());
});
Edit:
Did you change the wording of your question?
If not, I may have misunderstood you.
If you want to target the text input, then, as the others suggest, attach an event listener to that:
$('#val').keyup(function(){
slider.slider('value', $('#val').val());
});

Categories