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 に答える