Question

我有一个通用列表，我必须在找到ListBoxes和苹果产品和/或触摸设备后实现（我没有针对android进行测试）。

我的列表如下：

<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')

任何帮助将不胜感激：）

附加说明：

我尝试将'：focus'添加到css中的选定类中，这在Ipad和计算机上不起作用。

Edit_1：

我已经尝试在stackoverflow线程上建议添加填充，但是这不起作用。

Edit_2：

尝试了更新，更新的Ipad，问题仍然存在，所以我认为它与兼容性无关。

Answer 1

我自己解决了这个问题，只需使用classList的remove和add方法。

我替换了

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

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

以下网址帮助我解决了这个问题： https://developer.mozilla.org/en/docs/Web/API/Element/classList

列表项背景颜色在Ipad上不会更改

1 个答案: