Q&A
前提・実現したいこと
monacaでONSEN UIを用いてスマホアプリを作成しています。
ONSEN UIのリスト機能（ons-list-item）をクリックすると、onclickでそのリストの
色を
(リストのID).style.background-color = (色)
のようにして変更しようとしています。
発生している問題・エラーメッセージ
以下のように色が元に戻る減少が発生しています。
・マウスでクリックした場合、カーソルをリストから離すと元の色に戻る。
・スマホでタップした場合、他の部分をタップすると元の色に戻る。
なお、リスト以外の色を変えた場合は元の色に戻ることはありませんでした。（ボタン、チェックボックスで確認）
どうにかして色が戻らないようにさせたいです。
該当のソースコード
HTML
1<body> 2 <ons-page id="main"> 3 <ons-list> 4 <ons-list-item id="list" onclick="test1(this)"> 5 TEST 6 </ons-list-item> 7 </ons-list> 8 <ons-button id="button" onclick="test1(this)"> 9 TEST 10 </ons-button> 11 </ons-page> 12</body>
Javascript
1 function test1(id) { 2 id.style.backgroundColor = "#ff0000"; 3 } 4
試したこと
ONSEN UIのcssの中の、ons-listに関係がありそうな部分をコメントアウトしてテストしましたが駄目でした。
マウスの場合はリストの色が変わったあとに続けてクリックした場合色が戻りませんでした。
白→赤 ＝白
白→赤→赤 ＝赤
白→赤→青→緑 ＝青
白→赤→青→カーソルを外す(赤になる)→緑→紫 ＝緑
のように色が変わるようです。
あなたの回答
tips
プレビュー
