html - JavaScript的 onclick 事件是如何调用jquery 方法的

Question

<input type='button' id='abc' value='－' title='测试1' onclick='abc()'>

$(document).ready(function(){
   function abc(){ 
      alert(1111)          
   }
})

Uncaught ReferenceError abc function is not defined 错误提示
在$(document).ready(function(){})中不能调用。但是将方法写在外面即可调用

<input type='button' id='abc' value='－' title='测试1' onclick='abc()'>
function abc(){ 
    alert($("#abc").val())          
}

能够弹出val值

====================================

**那么js和jquery混着在一起了。这样写会有什么问题？
$("#abc").val() 和原生的JavaScript 和区别在哪里？
**

Answer 1

在$(document).ready(function(){})中不能调用，但是将方法写在外面即可调用。原因很简单。因为当你把abc写在那个作为ready的参数的匿名函数里的时候，abc这个变量的作用域也仅限于那个匿名函数里。那个匿名函数之外自然无法使用 abc 这个变量。

至于第二个问题。无非就是调用 jQuery 这个 library 的 $ 方法 和 val 方法而已。jQ 对这两个函数的实现无非也就是再去 call 原始的 JavaScript DOM 方法。

Answer 2

在ready里写的都是控件绑定函数 $(document).ready(function(){ $("#abc").click(function(){ alert("helloworld") ;
}); });` 当文档对象模型已经加载，并且页面已经完全呈现时，触发 ready 事件，然后里面的控件函数严正以待，一旦有控件响应里面的函数，即执行。 像你这样混合调用，外面调用是进不去的。 js是脚本语言，jq是js之上的框架