オブジェクトを名前と価格とともに JavaScript に保存しました。オブジェクトごとに個別の div を使用して、それらを html に追加しました。div をクリックすると、背景色が変わり、オブジェクトが選択されたことを示します。しかし、どうすれば画面上の div を JavaScript オブジェクトにバインドできますか? ユーザーが div をクリックすると、そのオブジェクトの「select」プロパティが「true」に変わります。
これが私のコードです
オブジェクトを名前と価格とともに JavaScript に保存しました。オブジェクトごとに個別の div を使用して、それらを html に追加しました。div をクリックすると、背景色が変わり、オブジェクトが選択されたことを示します。しかし、どうすれば画面上の div を JavaScript オブジェクトにバインドできますか? ユーザーが div をクリックすると、そのオブジェクトの「select」プロパティが「true」に変わります。
これが私のコードです
オブジェクトを配列に格納します。
div を作成するときは、id
of を付けsomething_something_array_index
ます。
split
などの正規表現を使用して ID を抽出できます。
または、任意のプロパティを HTML Element オブジェクトに割り当てることができるので、次のようにするだけです。
myDiv.source_data = myObject;
これは便利だと主張する人もいれば、非標準のプロパティを追加すると、将来名前空間の衝突が発生するリスクがあると主張する人もいます。
作成した属性を変更できます。たとえば、各 div は「selected」属性を持つことができます。jQuery を使用してこの属性を設定できます。
セッター:
$(element).attr('selected', value)
ゲッター:
if($(element).attr('selected') == value
クリックイベントハンドラーでこれを使用できます