工作示例：

Question

我想知道为什么我的简单警报功能没有被解雇？我是jQuery的新手。

$(function() {
  function myfunc() {
    alert("jjj");
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<form id="myform" onsubmit="return myfunc()">
  <input type="text" onclick="myfunc()" name="values" />

  <input type="submit" value="Done" />
</form>

Answer 1

首先，问题必须专门针对JavaScript，而不是示例中的jQuery部分。

你的onclick正在访问全局范围内的函数，但是你的函数定义在另一个函数的范围内，所以它在'闭包'中 - 并且不能在外部函数的调用对象之外访问。通常，您可能不希望出于这些类型的原因使用onclick - 除非它在某些框架中，例如角度，它引用控制器上的某些函数...

以下是一个更适合您的事件处理程序示例。（你应该总是做一个这样的测试用例：https://jsfiddle.net/sheriffderek/sjpq1x5j/）（因为你是新手，请记住，如果你制作一个jsFiddle - 你需要在小提琴的js设置中添加jQuery。）

HTML

<form id="myform">
  <input type="text" onclick="myfunc()" name="values" /> 
  <input type="submit" value="Done" class='js-formSubmit' />
</form>

<button class="js-button">test me</button>

JS

$(function() {
  function myfunc() {
    alert("You can't get me from the global scope because I live in this scope.");
  }
});

$(function() {

  $('.js-formSubmit').on('submit', function(event) {
    event.preventDefault(); // if you don't want to send the form normally
    alert('hi!');
  });

  $('.js-button').on('click', function(event) {
    alert('hi!');
  });

});

Answer 2

<script>
    $(function() {
        function myfunc() {
            alert("jjj");

        }

    });
</script>

到

<script>
    $(function() {

    });
    function myfunc() {
        alert("jjj");
    }
</script>

Answer 3

您的myfunc嵌套在外部函数中，该函数再次嵌套在jQuery ready函数中。因此在外部功能之外是不可见的。请尝试以下方式：

    function myfunc() {
        function a () {
            alert("jjj");

        }
        return a;
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myform" onsubmit="return myfunc()">
    <input type="text" onclick="myfunc()()" name="values" /> 

    <input type="submit" value="Done" />
</form>

Answer 4

如果您正在使用ES6，则可以使用arrow这样的功能执行此操作：

()=> {
  alert("jjj");
}()

Answer 5

我删除了你添加的这个包装器，因为它没有必要，它改变了定义函数的范围。 urlpatterns在窗口对象中查找onclick，并且由于此包装函数更改，因此范围myfunc未定义。

我删除了什么：

myfunc

工作示例：

＆＃13;

$(function() {
});

＆＃13;

使用jQuery onload的工作示例

如果你想在这里添加一个包装函数，你会怎么做。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<form id="myform" onsubmit="return myfunc()">
  <input type="text" onclick="myfunc()" name="values" /> 
  <input type="submit" value="Done" />
</form>
<script>
  function myfunc() {
    alert("jjj");
  }
</script>

＆＃13;

$(document).ready(function(){
  $("#done").click(function(){
    alert("jjj"); 
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="myform"> <input type="text" name="values"/> <input id="done" type="submit" value="Done"/> </form>也造成了问题，所以我删除了它。这是非常真实的案例＆＃34;包装函数的场景。根据w3schools ...

当DOM（文档对象模型）出现时，就会发生就绪事件   加载。

因为此事件在文档准备好后发生，所以很好   有所有其他jQuery事件和功能的地方。就像在   上面的例子。

ready（）方法指定就绪事件发生时会发生什么。

jQuery为什么我的函数没有触发

5 个答案:

HTML

JS

工作示例：

使用jQuery onload的工作示例