jquery中onclick(function(){})和on('click',function(){})函数有什么区别

时间:2014-07-04 06:55:11

标签: javascript php jquery html ajax

我正在尝试使用ajax在一个div中加载页面: 这是我的HTML代码:

 <ul id="nav" class="nav" style="font-size:12px;">
    <li><a href="#" id="m_blink">Tab1</a></li>
    <li><a href="#" id="d_blink">Tab2</a></li>
    <li><a href="#" id="k_blink">Tab3</a></li>
</ul>
<div id='home'></div>

当我在一个div中调用这个页面时,就像'home'div那样:

$(document).ready(function(){

     $("#m_blink").onclick(function() {
        $("#home").load("tab1.php",{},function(){});
     });

     $("#d_blink").onclick(function() { 
        $("#home").load("tab2.php",{},function(){});
     });

     $("#k_blink").onclick(function() { 
        $("#home").load("tab3.php",{},function(){});
     });
});

在chrome和Firefox中,当我检查元素时,错误是:

在chrome:

'未捕获的TypeError:undefined不是函数'

并在firefox中:

[12:15:46.575] TypeError:$(...)。onclick不是函数

当我将我的jquery代码改为喜欢这个

$(document).ready(function(){

     $("#m_blink").on('click', function() {
        $("#home").load("tab1.php",{},function(){});
     });

     $("#d_blink").on('click',function() { 
        $("#home").load("tab2.php",{},function(){});
     });

     $("#k_blink").on('click',function() { 
        $("#home").load("tab3.php",{},function(){});
     });
});

当我执行此代码时,这是有效的,jquery中的onclick函数之间有什么区别。

1 个答案:

答案 0 :(得分:4)

jquery中没有onclick函数。所以错误是正确的,不言自明。

TypeError: $(...).onclick is not a function

您应该使用.click(),这是.on("click", handler)

的快捷方式
$(selector).click(function() {
});