hi this is my codes in a js page with this name script.js
(function ($) {
myfunc()
{
//some jquery codes
}
}
and I use this function in a html page like this
<html>
<script src='js/script.js'></script>
<button id='btnSent'>sent</button>
<script>
(function ($) {
$('#btns').click(function () {
myfunc();
})
}(jQuery));
</script>
</html>
but in console i have an myfunc is undifined error
myfunc is not global - it's only visible inside of the upper (function ($) { block, due to ordinary Javascript scoping rules. Try using just one (outer) function instead, that way anything else in the inner block would be able to see the myfunc which is also in the inner block:
(function ($) {
function myfunc(){
//some jquery codes
}
$('#btns').click(function () {
myfunc();
})
}(jQuery));
If you have to keep the functionality separate for some reason, you could have script.js assign to a window variable:
(function ($) {
window.myfunc = function() {
//some jquery codes
}
})(jQuery);
You are using IIFEs in both cases. The scope of myfunc() is inside the IIFE in your script.js and not in the global scope. Hence you cant access it from the IIFE in your html. Either don't use an IIFE in your script.js just have,
function myfunc(jQuery)
{
//some jquery codes
}
or have the myfunc() inside your IIFE in script tag. This will be helpful for you to understand better about IIFEs
