I have a page with a textbox that I want to have a message written inside it that will dissapear when the user clicks in the text box and writes something and it will show up again if the user clicks somewhere else but hasn't written anything inside the textbox. So I am using the onfocus event in order to write "Enter your email here" and the onfocus event in order to show the "Enter your email here" message inside the textbox if the user clicks somewhere else in the webpage but has left the textbox blank. If however the user has written, for exampl "jim@yahoo.com", I want this to remain in the textbox.What am I doing wrong?
For those who have been using Outlook Express, you must be pretty used to the fact that whenever you focus on the preview section, the header for the preview turns from grey to blue, while the text turns from black to white. Code:
I want to have a function on an event <span id= "nameheader"> </span> <form method ="post" action="send.php"> <input id = "nameinput" class = "input" value = "name" onfocus = "focus();" onblur = "blur();" />
That is when you focus on the input box the value ' name' gets put above the box and when you focus on something else it goes back to the box. this is my function focus(){ document.getElementById('nameheader').innerHTML = 'name'; document.getElementById('nameinput').value = ''; } And I would obviously do the opposite for onblur event.
I've just found out that a piece of code is not working as expected in certain browsers - but the way in which it goes wrong is not consistent, so maybe it's something wrong with my code.Oddly enough, it works exactly as I was expecting when viewed in IE.Here's the code...
I have a text input field - a search box. As characters are entered, I use AJAX to retrieve a list of matches from my products table and display them in a simple unordered list below the search box.This works great, until the user clicks one of the matches.Because I have set the onblur event of the search box to hide the autocomplete box, when the search box loses focus as a result of one of the links in the autocomplete box being clicked, the autocomplete box is hidden and the link is not activated.How can I get the links to work, and also have the autocomplete options disappear when the search box loses focus?
I am currently working on a website that administers timed online tests, and we are trying to implement some measures to reduce the ability to 'cheat' while the test is running. These include disabling right clicks, and handling keystroke events. Additionally, we would like to end the test if the maximized browser popup window where the test is loaded happens to lose focus during the testing session.
I have implemented some code to call an event handler that will end the test if a window.onblur event is triggered during the session. It is working fine in Firefox, but IE seems to interpret window.onblur events differently. Basically, in Firefox I can click anywhere within the window without a window.onblur event triggering, but in IE if I click outside of the test table or form element etc. into whitespace, for instance, it fires.
In addition to using window.onblur, I have also tried top.onblur, and also putting onblur in the body tag of my html: <body bgcolor="#ffffff" onBlur="lostfocus()"> Again, both work in Firefox, but neither of these alternate methods seem to restrict IE in the appropriate manner.
So my question is this: is there any way to craft this such that IE will play nice and trigger the event ONLY when someone clicks outside of the browser window (on to the start menu, for instance)?
<script language="javascript"> <!-- window.onblur=lostfocus; function lostfocus(e) { // student has attempted to cheat, end test } // --> </script>
I have a link that has a UL drop down. When I click off of both the link and the UL I want the drop down to disappear. Right now it only disappears after I click off of the link.
dataCheck validates the inputs value and if something is wrong, then.. document.getElementById('error_anInput').innerHTML = 'Error!' or if data is valid then the content of span is removed.
The checkWholeForm function iterates through all elements on the form and triggers onblur() for each input... leading to executing function dataCheck (and so changing innerHTML of some specific span elements if needed).
*The Problem* If I have entered incorrect data to an input and hit the submit button with my mouse (causing the onBlur event to be triggered just right before onSubmit) then *occasionally* for some fields the onSubmit event is not triggered because the onClick event is not triggered. :S
As there are actually quite many complex functions (tested and these seem OK afaik) that are doing the checks then dowes anyboudy have a clue what type of code might break this. I thought at first that setting innerHTML to some value during onBlur disables all waiting events but as this is happening occasionally (on some machines) I'm in doubt...
any ideas what to check? double declaration of function/variable names? Not deleting some object after usage? ... anything?
Waiting for any ideas...
PS. http://eix.lap.ee/test/portali_js.html in the example *occasionally* third field generates the error - remove any content from the field and stright hit the submit (*with mouse* - to create onBlur and onClick at the same time).
I have made many forms that trigger with the onblur event on text boxes, and I want to make it posible to trigger the same events when I hit the enter key but without loosing focus (I know I can call the blur event and trigger the onblur event but I don't want to loose focus). By the way Iam using prototype.js .
After the user types in the textboxes and press enter (with the cursor still in one of the textboxes), buttonXXX should be pressed by default.(the user is too lazy to take the cursor over to buttonXXX and click).
The problem is the top/left most button (button A) gets pressed which annoys them to death. So I tried to do this.
In the bottonA's onfocus event handle- document.forms[0].elements['buttonXXX'].focus() .
Result: ButtonXXX receives focus alright, but the code for buttonA still executes!
I have found what seems to be a bug. When you have a keydown, keypress and keyup event handler on a text box in Opera, it won't call the keyup handler when you hit the down arrow key. Every other key, including up arrow, seems to work fine.
To make sure it wasn't just me, I tried this in Opera with one of Mike's demos:
If you use the arrow keys while any object other than a textbox has focus, keydown, keypress and keyup show 40 and 38 for down and up arrow, respectively. However, if you focus on one of the textboxes, 40 only shows up for keydown and keypress, not keyup. 38, however, continues to show up for all events.
I have kind of a complicated setup, and I was hoping to bounce this off some one's head who's more experienced with JavaScript.Assuming I have the following HTML markup:
I have a problem with one simple script, which works in every browser, just not in IE6 and IE7. You can see the script at [uRL] - when you click on the iframe, you should see "clicked at the bottom". But it doesn't work in IE6 and IE7.
I got a pice of html that i want to transform to UI Tabs. This code is aouto generated and wrong, so I want to correct it before calling tabs() function
I'm looking for some guidance on a part of some coding practice I'm stuck on!
I've created a shopping cart using javascript, the items save to the arrays etc and it all works fine. If the user adds the same product again to the cart the quantity is added onto the previous quantity that is already in the cart.
To check if the item is already in the cart I've ued the below code, but what it does is update the quantity for the first cart, and when it updates the quantity for the second item it updates the quantity but keeps adding the same product to the cart in seperate elements of the array as well (if that makes sense?
here are the two functions used [code]...
It may jsut be a simple mistake I've made but it's been bugging me a lot and I can't seem to fix it.
I am sorry if this is a stupid question. I have never really used javascript before. I found some code online that I tried to piece together so I might not even be going about this the right way.
I want the background to take up 100% and resize with the browser. That works fine. I also want the text "welcome to the ahi life" stick to the bottom left hand corner and the enter button to stick to the bottom right. I would like these to resize with the browser as well. It all kind of works, except the first time you load the page the text and the button are much smaller than I would like them to be. If you refresh the page everything is correct.
If you look at this page [url] you will see that if you hover over the photo the text block goes up, and if you hover over the text it slides down and covers the photo. It's all pretty basic and it works fine. But ones I try to get them animated during the sliding up and down the trouble starts.
It works fine if you take the time and wait for them to go back to their starting position, but if you move over the items quickly it becomes a mess. You can see what I mean on this page [url]
I hoped that by adding a stop() before the animation if would fix the problem, but it doesn't really improve at all. It still quickly becomes a mess if you hover from one item to the next one.
How I could get the animations to work properly without it becoming a mess? I now there are double id's in the html, but unfortunately I can't really change the html.
I have a bunch of floated divs and I want to increment a variable every time they 'jump' to the next line. When I try using offset() for this I get the same top,left cords for every single element. Is there any way of getting the actual offset? (I get the same result in FF and Chrome)
I'm having a problem with my radio buttons. On FF and Chrome they work just fine, but in IE, they does'nt appear as sellected. In other words: they do their job, but when you click'em, they stay unckeched. The genetarion code:
var item = $('<input type="radio" />').attr('value',pid).attr('name',name); self.append($('<p />').append(item).append('<label>'+desc+'</label>'));
I am trying to make a textbox enter input by pressing the enter key, not just clicking a submit button. For some reason or another it is not working correctly for me. I found this snipet of code that works for me but I was wondering if someone can explain it to me. I get the basic of what it is doing, I just want to understand it better.
i am following the example ajaxSubmit[URL].... here my code[URL]... i realized that the showRequest work correctly, shown all my form submit values But it doesn't respond "showResponse(responseText, statusText, xhr, $form)" is not execute. the respond prompt is not pop up
I am trying to get this code to work in IE. It works on Firefox, but not on IE. Basically it blocks out scrolling the page down with space button, and registers up and down keys to run some code. The entire case statement including event registering and my code works completely fine in FF but it just won't work in IE (meaning that I can scroll down with space, and up and down with the up and down keys respectively).
By the way I put this function in the HEAD section.
window.onkeydown = function(event) { // No space scrolling! switch (event.keyCode)
