javascript - (document).ready is a global scope? - Stack Overflow

admin管理员组

文章数量:1402858

Guys i have this function inside my script.js:

$(document).ready(function() {
    function alert() {
      alert('AAAAAAAA');
    }
});

And i am trying to call here in my index.html:

$('.something').on('click', function() {
  e.preventDefault();
  alert();
});

But is showing my this error - alert is not defined.

But when i take off the document ready in the external script, the click handler will work. Why is that?

The document ready is creating a separate scope?

Guys i have this function inside my script.js:

$(document).ready(function() {
    function alert() {
      alert('AAAAAAAA');
    }
});

And i am trying to call here in my index.html:

$('.something').on('click', function() {
  e.preventDefault();
  alert();
});

But is showing my this error - alert is not defined.

But when i take off the document ready in the external script, the click handler will work. Why is that?

The document ready is creating a separate scope?

• javascript
• jquery

Share Improve this question Follow edited Feb 7, 2015 at 21:10 Bergi 666k161161 gold badges1k1k silver badges1.5k1.5k bronze badges asked Feb 7, 2015 at 21:01 user4520762user4520762 6

• 3 You shouldn't use "alert" as name for a custom function, since alert is already a built-in function in javascript. Try to call it differently and don't forget to add "e" as a parameter in your click callback function. – Adrian Bolonio Commented Feb 7, 2015 at 21:04
• You are missing a parameter in the call to alert() in $(".something", .... – castor Commented Feb 7, 2015 at 21:05
• @AdriánBolonio this is just an example, the real function is more plex them that, but the idea is the same. – user4520762 Commented Feb 7, 2015 at 21:07
• It's not the $(document).ready() that is creating the scope, but the function(){ }! – Bergi Commented Feb 7, 2015 at 21:09
• Please ask only one question per post, I've removed the second one. Ask another one if you don't find your answer in this blog post - yes, your version is usually better than your teacher's. – Bergi Commented Feb 7, 2015 at 21:12

 |  Show 1 more ment

3 Answers 3

Sorted by: Reset to default 6

Using $(document).ready() creates a new function scope (note the function() after the .ready), so when you call

$(document).ready(function() {
    function alert() {
        alert('AAAAAAAA');
    }
});

alert is only defined within the document.ready block. There are two ways to solve this issue:

1. Define the function outside of the document.ready block:

   function customAlert() {
       alert('AAAAAAAA');
   }
   

2. Attach the function to the window object:

   $(document).ready(function() {
       window.customAlert = function() {
           alert('AAAAAAAA');
       };
   });
   

Include the click event into the document.ready

Check it here http://jsfiddle/fbrcm45q/1/

$(document).ready(function() {
  function showAlert() {
    alert('AAAAAAAA');
  }
  $('.something').on('click', function(e) {
    e.preventDefault();
    showAlert();
  });
});

First of all e.preventDefault is a function so you have to add braces at the end:

e.preventDefault()

Second alert is a function in javascrpt, so you need to rename your function to something else, for example:

$(document).ready(function() {
    function special_alert() {
      alert('AAAAAAAA');
    }
});

and:

$('.something').on('click', function() {
  e.preventDefault();
  special_alert();
});

本文标签： javascript(document)ready is a global scopeStack Overflow