6

Right now I'm using <body onload="function">, which changes some text on the page based on which element is focused on. It works fine, but I need my site to run the function every time the focus changes (or, even better, every time any part of the page is clicked).

Currently the code looks like this:

<body onload="changeText()">
<script>
function changeText(){
     function here;
}
</script>
<p>This is where text changes based on the function</p>

Thanks!

5
  • I think he's asking what to hook the onclick to. Commented Oct 11, 2012 at 17:58
  • 2
    Why are people down voting this legitimate question? Commented Oct 11, 2012 at 18:02
  • @RASG so what, same goes for an extremely high percentage of most of the questions on SO, including the ones with high votes. Searching SO I couldn't find a similar question. And that is what matters. Commented Oct 12, 2012 at 16:10
  • 1
    @AnthonyHatzopoulos Searching SO I couldn't find a similar question. And that is what matters. oh really? stackoverflow.com/questions/3521487/javascript-body-onclick , stackoverflow.com/questions/9152802/… , stackoverflow.com/questions/12762472/… Commented Oct 12, 2012 at 16:21
  • @RASG awesome & +1 for you! btw I found that first one too, you must of really searched hard for those or not; you just know of the onclick event where as sway doesn't. The 2nd SO link is the best but if you have no idea what onclick is to begin with this question's title is better for the beginner. I wouldn't consider the 1st link related, especially to a beginner. The 3rd is close but still for a beginner is not obvious especially with textarea in the title. Commented Oct 12, 2012 at 16:53

4 Answers 4

8

You can attach onclick event on document. jsfiddle

​document.onclick = function(){
 // your code
 //alert("clicked");
}​

If you want change on focus then use

window.onfocus = function(){

   // your code
     //alert("focus");
}
Sign up to request clarification or add additional context in comments.

8 Comments

This method will also disable every other normal click event on the page. Example jsfiddle.net/5TVAm/1
@AnthonyHatzopoulos Why do you think it will disable other click event. both are separated example I showed in one. changing body html is just to show that focus got called. OP will use it differently.
ok to be fair and to be clear: the window.onfocus function will overide normal click events. document.onclick will not. Example jsfiddle.net/6qKyq/1
@Shusl Directly setting .onclick overwrites any other previously bound click events. Using something like addEventListener actually adds a new event.
@Shusl I believe @ianpgall is talking about document.onclick = myCustomFunction(); will be overwritten by a second call to document.onclick = mySecondCustomFunction(); (if there is one that exists)
|
3

window.onclick = function () {
  //do some stuff
  document.body.style.backgroundColor = "red";
}
<p>text text text</p>
<button>it does not matters if you press me or any where else</button>

Comments

1

Try this:

<!-- language: lang-html -->
<body onload="changeText()">
<script>
function changeText(){
    function here;
}
document.onclick=function(){changeText();};
</script>
<p>This is where text changes based on the function</p>

Comments

1

jQuery doesn't suffer from the disable-clicking issue

$(document).click(function(e){
                //Blah
            })

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.