複数のリンクでgetElementsByClassNameの問題が発生する

以下のコードは例です - 同じ機能を有効にしたいページに複数のリンクがありますが、GetElementsByClassを使用してこの機能を有効にするためのページの最初のリンクしか取得できません。複数のリンクでgetElementsByClassNameの問題が発生する

<script> 
    window.onload = function() { 


     var a = document.getElementsByClassName('watchlist')[0]; 

     a.onclick = function() { 

      $.post("watchlistinsert.php?symbol=AAPL&price=25&watchlistgroupid=1"); 

      return false; 
     } 
    } 
</script> 
<body> 
<a class="watchlist" href="##">linky</a> 
<a class="watchlist" href="#">linky1</a> 
<a class="watchlist" href="#">linky2</a> 
<a class="watchlist" href="#">linky3</a> 
</body>

出典

2017-09-15 Steingrimur Jonsson

'getElementsByClassName'はあなたが望むものとまったく同じです。実際にループが必要なように聞こえます。 – SLaks

はい、最初のリンクで動作します。私の質問は、それらをすべて働かせる方法があればでした。あなたはそのループをどこに置くのですか？そしてどうやって？ –

あなたはそれらすべてを同じものにリンクしたいですか？ – baao

getElementsByClassNameは、すべての要素が一致する配列を提供します。ですから、このようなそれらすべてをループ、必要があります。

var elements = document.getElementsByClassName('watchlist'); 
for(var i=0; i<elements.length; i++){ 
    elements[i].onclick = function() { 
     $.post("watchlistinsert.php?symbol=AAPL&price=25&watchlistgroupid=1"); 
     return false; 
    } 
}

はまた、私はあなたが原因$.postのjQueryのを使用していると仮定します。もしそうなら、次のようにすることができます：

$('.watchlist').click(function(){ 
    $.post("watchlistinsert.php?symbol=AAPL&price=25&watchlistgroupid=1"); 
    return false; 
});

出典

2017-09-15 19:05:27 Piyin

ありがとうございました！私は今この機能の周りを踊っています....そして、それはjQueryの1つでした:) –

確かに問題はありません:) – Piyin

複数のリンクでgetElementsByClassNameの問題が発生する

答えて

関連する問題