2016-10-11 5 views
0

リストボックスとリンゴの製品やタッチデバイス(私はアンドロイドに対してテストしていない)について調べた後に実装しなければならない一般的なリストがあります。リストアイテムの背景色がIpadで変更されない

私のリストは、次のようなものです:

<ul> 
    <li> 
<ul> 

リスト項目タグが作成され、実行時に移入されます。次のように

マイJS/jQueryのです:

$('.List li').on('click touch', function() { 
var selected; 

selected = document.querySelector('li.selected'); 
console.log(selected); 
if (selected) 
    selected.classList = ''; 
this.classList = 'selected' 

document.getElementById('ItemValue').value = this.id; 
}); 

これは私がそれをコンピュータ上で仕事をしたいだけでどのように動作し、それは、項目を選択し、CSSを適用します。

これをIpadでテストしたところ、になりましたが、CSSは適用されません。アイテムをタップした後でリスト内のアイテムの配置を操作できるので、選択されていることがわかります。

私はJs/Jqueryを使用して背景色を設定したくないので、クラスを追加し、必要に応じてそれらを削除することをお勧めします。

$(this).css('background-color', 'colour') 

任意の助けいただければ幸い:)

その他の注意事項:

私が追加しようとしました:これはしなかった、選択したクラスにCSSの 'フォーカス' をIpadとコンピュータで作業します。

Edit_1:

stackoverflowのスレッド上で示唆したように、私は、しかし、これは動作しませんでした、パディングを追加しようとしました。

Edit_2:

が最新iPadにまでより新しく、より多くのを試してみましたが、問題はまだので、私はそれが互換性とは何かを持っているとは思わない持続します。

答えて

0

私はこの問題を自分で解決しました。クラスリストのremoveメソッドとaddメソッドを使用してください。 https://developer.mozilla.org/en/docs/Web/API/Element/classList

は、私は、次のURLは、私はこの問題を解決する助け

selected.classList = ''; 
to: 
selected.classList.remove('selected'); 

selected.classList = 'selected'; 
to: 
this.classList.add('selected'); 

を置き換えます
関連する問題