1 
<div class="tabContainer">
  <ul class="Tabs" id="tabset">
    <li id="tab1" class="selected" onclick="tabs(this)">Home</li>
    <li id="tab2" onclick="tabs(this)">Tab 2</li>
    <li id="tab3"  onclick="tabs(this)">Tab 3</li>
  </ul>
</div>

我想删除onclick="tabs(this)"并将其变成一个事件。我怎样才能做到这一点？目前下面的代码是我的解决方案，它不起作用。

var h=$("tabset").children;
for (i=0;i<h.length;i++) h[i].onclick=tabs(this);

哦，请不要使用 jquery，但请var $ = function(x){return document.getElementById(x)}; 注意：我需要这(this)部分。

4

2 回答 2

2

您似乎$在代码中使用了一些不标准的功能。例如，如果您使用 jQuery，您的代码可能如下所示：

$('#tabset li').on('click', tabs);

如果您不想使用 jQuery，那么您将不得不调整您的选择器：

var h = document.getElementById('tabset').getElementsByTagName('li');
for (var i = 0; i < h.length; i++) {
    h[i].onclick = tabs;
}

或者因为您声明：

var $ = function(x){
    return document.getElementById(x)
};

你也可以使用：

var h = $('tabset').getElementsByTagName('li');
for (var i = 0; i < h.length; i++) {
    h[i].onclick = tabs;
}
于 2013-04-07T10:37:17.207 回答
1

我建议：

var lis = document.getElementById('tabset').getElementsByTagName('li');
for (var i = 0, len = lis.length; i < len; i++){
    lis[i].onclick = tabs; // inside the function 'this' will refer to the node.
}

JS 小提琴演示。

尽管您可以将点击处理程序分配给包含ul元素：

var list = document.getElementById('tabset');
tabset.onclick = list.addEventListener('click', function(e){
    tabs(e.target);
}, false);

JS 小提琴演示。

你可以，现在我看到你用你的函数做了什么，避免使用getElementById()并简单地链接：

$('tabset').addEventListener('click', function(e){
    tabs(e.target);
}, false);

JS 小提琴演示。

使用 jQuery，正如您出现（在编辑之前）试图使用的那样：

$('#tabset li').click(function(){
    tabs(this);
});
于 2013-04-07T10:37:35.107 回答