onclick関数からjavascript配列へのアクセス

Question

jQueryを使用していて、document.readyで配列を設定しています。

私のページには、クリックイベントのある要素があります。私はその関数をdocument.ready関数の外で定義しました。

私のonclick関数からその配列変数にアクセスする方法を理解できないようです。簡単にするために

、私は仕事に、このような何かをしたいと思います：

$(document).ready(function(){ 
    var artists = new Array(); 
    artists.push('item1'); 
    artists.push('item2'); 
}); 

function clickLink() { 
    alert(artists[0]); 
} 

Answer 1

最も簡単な方法の一つは、.ready（）関数の中でクリックハンドラを動かすことです。そして、あなたがそこに要素の代わりに、インライン属性にバインドする必要があります。

$(document).ready(function(){ 
    var artists = new Array(); 
    artists.push('item1'); 
    artists.push('item2'); 

    $('#idOfTheElement').click(function() { 
    alert(artists[0]); 
    }); 
}); 

Answer 2

やああなたは、配列の作成の範囲を失ったので、それをすべて同じスコープに入れ

を解決するには2つの方法があります：

$(document).ready(function(){ 
     var artists = new Array(); 
     artists.push('item1'); 
     artists.push('item2'); 
    function clickLink() { 
     alert(artists[0]); 
    } 
    }); 

グローバルとして宣言配列：

var artists = new Array(); 
$(document).ready(function(){ 

     artists.push('item1'); 
     artists.push('item2'); 

    }); 
function clickLink() { 
     alert(artists[0]); 
    } 

Answer 3

あなたはdocument.ready()関数の外artists配列を宣言し、クリックイベントに機能をバインドする必要があります。

var artists = new Array(); 
 

 
$(document).ready(function() { 
 
    artists.push('item1'); 
 
    artists.push('item2'); 
 
}); 
 

 
$('button').click(function() { 
 
    console.log(artists[0]); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button>click</button>

Answer 4

シンプルなソリューションを使用すると、配列変数を宣言するときに変数グローバルを行いますされ、varキーワードを削除することです、それは推奨されませんし、別の解決策は、外部のあなたの配列を宣言することです関数をonclick関数から参照できるようにします。