0

アイテムのリストを操作する関数をJavaScriptで作成しようとしています。リストはCMSによって生成されており、JavaScriptでのみ影響を与えることができます。

リストが次のとおりであると仮定しましょう。

<ul id="someUniqueID"> 
  <li class="genericClass" id="uniqueGeneratedID"><a href="link1.htm">Link</a></li>
  <li class="genericClass" id="uniqueGeneratedID2"><a href="link2.htm">Link 2</a></li> 
  <li class="genericClass" id="uniqueGeneratedID3"><a href="link3.htm">So on and so forth</a></li> 
</ul>

今、私はJavaScriptが使用する機能を提供することを知っています

document.getElementById('uniqueGeneratedID').onmouseover = doSomething(); 
function doSomething(){ //code here }

代わりに、これらのliをすべて取得し、各li要素を具体的に識別せずに、それぞれにonmouseover関数を割り当てます。

私はこのようにやっています、

var x = document.getElementsByTagName('li'); 
var changeId = new Array(); 
for (var i = 0; i < x.length; i++)
{
    var j = 0; 
    changeId[j] = x[i].id;
    j++; 
} 
function mouseOver() {
for(var y = 0; i < x.length;  y++){
        document.getElementsById(changeId[y]).onmouseover = test(changeId[y]); 
    }    
}
function test(storeContent){
    document.getElementsById('storeContent').innerHTML = 'printing' + testId; 
}
mouseOver();

もちろん問題は、これがIDのイベントを介したオンマウスを実際に生成しないことです。を生成せずに、すべてのliのonmouseoverイベントを動的に割り当てる方法はありますか？

document.getElementsById('uniqueGeneratedID').onmouseover = doEvent(); 
document.getElementsById('uniqueGeneratedID2').onmouseover = doEvent();

等。？

ヘルプや提案をありがとう。

4

1 に答える 1

1

すばやく汚い方法は、親をつかんで<ul>その子をループすることです。

var ul = document.getElementById("someUniqueID"),
    lis = ul.getElementsByTagName("li");

for (var i = 0, l = lis.length; i < l; i++) {
    lis[i].onmouseover = function() {
        this.style.color = "red";
    };
}

例： http： //jsfiddle.net/rttXQ/

于 2011-10-10T21:55:48.920 に答える