jQuery hover firing without mouse over - javascript

I have an element with id=message1mark. The following code will run the two alerts when the page loads regardless of the position on the mouse. Any help would be appreciated.
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#message1mark").hover(alert("on"), alert("off"));
});
</script>

You need to wrap those alerts in functions:
$(document).ready(function(){
$("#message1mark").hover(function(){alert("on");}, function(){alert("off");});
});
Working example: http://jsfiddle.net/eJzKr/

What you tried would be interpreted as
try to call a function (which is why alert() is executed at the time of binding
and bind its result as a handler (which is nothing in this case)
$("#message1mark").hover(function(){
alert("on")
}, function(){
alert("off")
});
});

The correct way is:
jQuery("#message1mark").hover(function() {
alert("on");
},
function() {
alert("off"))
};
});

I believe that the alert() function fires automatically on each page. So even though you've tried to make it dependent on the hover function, it doesn't care.
It sounds like what you want is fundamentally a tooltip functionality. Some of the techniques listed in these resources might be a better way to approach things.
http://jquery.bassistance.de/tooltip/demo/
http://www.roseindia.net/tutorial/jquery/PopupOnHover.html

Instead of writing in two different functions you can include in one function itself. Below is the code for reference.
$(document).ready(function(){
$("#message1mark").hover(function(){alert("on");alert("off");});
});

Related

JQuery click() event listener not working

im trying to get a lil project going but im stuck on a very annoying thing.
$(document).ready(function() {
$("#search-button").click(console.log('hello'))
});
as you can see im targeting a search button with the id search-button and as soon as i click it something should happen. in this case i put a console.log in to test if it works but it doesn't. it always logs it as soon as i load the page , not when i click the button i target. ... what am i doing wrong
if you need more info on this pls tell me i tried to keep it as simple as i could
ty for your help
O.k
The click handler needs a function argument, not just the console.log by itself. Try this:
$(document).ready(function() {
$("#search-button").click(function() {
console.log('hello');
});
});
Inside of .click should be a handler .click(handler) and the handler should be a function. The browser is reading the code and when it hits console.log('hello'), it does it! It's seeing .click etc, but it doesn't matter; it next sees console.log and does it.
Try
$(document).ready(function() {
$("#search-button").click(function() {
console.log('hello');
});
});
As others have mentioned, the click function requires its own callback function. You can also use this, without requiring the use of document:
$("#search-button").on('click', function() {
console.log('hello')
})
I hope You're using jQuery version 3 or up. if you use 3 or up jquery version the good practice is you use Document binding Example:
jQuery(document).on('click', '#search-button', function(event) {
//your Code here...
console.log('hello');
});

How to use multiple handlers in jquery function

I have some code I am working on and I cannot seem to figure out the terms to search for assistance.
I am trying to add a jquery statement that executes when the #quickSearchResults_section is clicked "AND" when #nav-input is focused out.
So in a nutshell, I am still learning jquery and programming logic and want to use click function and focusout.
<script>
$(":not(#quickSearchResults_section)").click(function(){
$("#quickSearchResults_section").hide();
});
</script>
Try something like this:
$("#nav-input").on("blur", function(){
$("#quickSearchResults_section").click(function(){
$("#quickSearchResults_section").hide();
});
});

Add pre-written function to onclick of division

I have a division and I want a JavaScript function to fire when I click on the division. I've found ways of doing it, but they all involve writing the function and I just want to just fire to function and can't seem to get it to work. Can anyone help me?
<script type="text/javascript">
$('#item').click(view_summary(););
</script>
Try with
$('#item').click(view_summary);
you need to pass a function in argument (not to call the function directly unless view_summary return a function itself)
Try this approach:
$('#item').on('click', function() {
view_summary();
});
Wrap your code around document.ready thus it make sure that all the elements are loaded.
And use on click to bind an event. not just click
<script type="text/javascript">
$(document).ready(function(){
$('#item').on('click', function() {view_summary()});
})
</script>

Run Jquery Function on Page Load and on Keyup

I have been googling this for a while, and can't seem to find an answer :( Simply I have two JQuery functions right now:
$('#textareainput').keyup(function(){
//Stuff
});
$(document).ready(function(){
//Stuff
});
And I would like to combine the two because they have the same exact contents. So how would I go about combining the two? Something like this?
$(document,'#textareainput').keyup(function(){
/stuff
});
You can trigger the event manually after registering the handler
$(document).ready(function () {
$('#textareainput').keyup(function () {
//Stuff
}).keyup();
});
But note that, the keyup event related specific properties of the event won't be populated

Why i can not trigger the jquery function?

This is a button to close the click but it fail and not work. I would like to know what is the tab ID since i did not think i assign one when i create a tab.
Thank you.
This is my attempt
js
$("#closeTab").click(function() {
window.parent.$('#tt').tabs('close','Create List');
});
html
<input type="button" id="closeTab" value="Cancel" class="submit"/>
I found my js code is working but the button can not trigger it? Why? thank you
latest try:
<script>
$(document).ready(function(){
$("#addlist").validate();
});
$(function(){
$("#closeTab").click(function() {
window.parent.$('#tt').tabs('close','Create List');
});
});
</script>
It still doesn't work so i think it is because the upper function ? How to fix this?
================================================================================
Also, are there any ways to clear my session in using this jquery function (what should i add for instance)?**Thanks
With javascript, you have to delay the execution of certain functions (like event handlers) until the page loads fully. Otherwise, it is attempting to bind a function to an element that doesn't yet exist. With jQuery, you can pass a function to jQuery to be executed on page load very easily like this:
$(function(){ /* code goes here */ });
So to use this with your code, you would do this:
$(function(){
$("#closeTab").click(function() {
window.parent.$('#tt').tabs('close','Create List');
});
});
This way, when the jQuery attempts to bind the function to #closeTab, it happens after the page has loaded (and after #closeTab exists).
Do you have any errors in the console?
Do you include jQuery before that click binding?
Try changing the window.parent.... to alert('clicked!'); and make sure you're actually getting there.
Also, make sure the click binding is inside of a:
$(document).ready(function(){
// here
});
A script can close only the windows it creates. It cannot close the tab which it didn't create.
To rephrase, cannot close tab only if unless but when created tab by script which is same that close window.
I hope this makes sense.
Maybe the form is submitted and the browser navigates to another URL before the code could run? Try replacing function() with function(e) and adding e.preventDefault(); to the beginning of the event handler.

Categories

Resources