jQuery选项卡-使用onclick函数获取内容

Question

通过Ajax获取外部内容之后，我想获取内部内容。 为此，我尝试使用onclick但它不起作用。 我有一个错误说：

XMLHttpRequest无法加载javascript：void（0）;。 跨源请求仅支持HTTP。

HTML：

<div id="tabs">
<ul>
    <li><a href="#tab1">tab1</a></li>
    <li><a href="#tab2">tab2</a></li>
    <li><a href="javascript:void(0);" onclick="javascript:loadTest();">tab3</a></li>
</ul>
<div id="tab1">
     <p>blabla</p>      
</div>  
<div id="tab2">
     <p>blabla</p>      
</div>
</div>

JQUERY：

function loadTest(){
    return "this content must be displayed tab3";
}

我如何从客户端获取任何数据以将其放入对应于tab3的div中

Answer 1

由于您已经在使用jQuery UI Tabs ，我建议您使用activate事件 。

$(function () {
    $("#tabs").tabs({
        activate: function (event, ui) {
            alert(loadTest());
        }
    });
});

JSFiddle

Answer 2

为什么要使用onClick？ jQuery具有处理页面上尚未存在的内容的功能。

您应该使用jQuery中的.on函数。 您可以这样做：

$(document).ready(function()
{
    $('#tabs').on('click', 'li', loadtest)
});

JSfiddle： http : //jsfiddle.net/DyRQZ/