Javascript 动态切换jQuery mobile ListView的拆分按钮

我正在使用jquery mobile构建一个移动应用程序。我正在使用listview控件，到目前为止，它工作正常。 但是，我想显示一个拆分按钮（），但仅当单击某个按钮时显示。用例是启用/禁用“删除模式”，这样只有在单击工具栏上的按钮后，删除图标才会出现在列表元素旁边。我有一个大致可行的解决方案，如下所示：

$('#editmode').live('click', function(e){
e.preventDefault();
$('.deletelog').toggle();
$('.deletelog:hidden').closest('li').removeClass("ui-li-has-alt");
$('.deletelog:visible').closest('li').addClass("ui-li-has-alt");
}); 

问题是，对于第一页加载，即使默认情况下按钮是隐藏的：

<a href="#" class="deletelog" style="display:none">Delete</a>

我仍然需要添加数据属性数据分割图标和数据分割主题，这使得第一个页面加载在某种程度上看起来，为按钮保留了一个空间。从上面的代码中可以看出，这是因为类“数据分割主题”。因此，如果我切换它，那么它将在第二次切换时消失

有没有更好的方法来实现这种切换分割按钮

谢谢

---

通过添加类并使用jQuery对其进行操作，可以显示和隐藏拆分按钮

显示

$('.delete').css('display', 'compact');

隐藏

$('.delete').css('display', 'none');

看看这把小提琴

更新 在这种情况下，您需要更新

ui-li的css

$('.ui-li-aside ').css('margin-right', '50px');

检查这把现场小提琴
谢谢！事实上，在第一篇文章中，我并不十分清楚我的问题。我用两个截图更新了它。问题在于，当您使用数据分割图标数据属性时，jquery mobile会添加一定的间距。