Question

我在jQuery Mobile中使用了addClass函数。我可以在代码中看到添加了类，但是应该应用它的样式会被忽略。

如果我将该类添加到html并刷新页面，则会对该类进行样式设置。因此在我看来，它可能与JQM如何呈现页面有关。

    $('.slider1').click(function(){
        $('.sliders').addClass('.slidersPosTwo');
    });

Answer 1

以编程方式修改JQM内容后，通常需要刷新增强功能。例如，可以使用$(".slider").slider("refresh");来完成此操作。此外，增强后的元素在增强后具有完全不同的结构（例如，为单个滑块添加了许多新的DOM元素）。可能是你没有将你的类添加到正确的DOM元素（除非你设置一个jsfiddle或类似的东西，否则不能验证这个）。

Answer 2

查看.addClass()：http://api.jquery.com/addClass/

的文档

注意这些示例如何省略类名开头的句点（.）。如果您离开句点，那么它将作为类名的一部分添加，该名称应仅用作选择器。

如果您进行此更改，您的代码将有效：

...
$('.sliders').addClass('slidersPosTwo');//notice, no period before the class name
...

Answer 3

替换：

    $('.sliders').addClass('.slidersPosTwo');

使用：

    $('.sliders').addClass('slidersPosTwo');

更好的是，here你可以找到一个实时的jsFiddle示例，如何修改每个滑块元素。例如：

// Slider label
$('div[data-role="fieldcontain"] label#slider-label').addClass('custom-slider-label');
// Slider text box
$('div[data-role="fieldcontain"] input#slider').addClass('custom-slider');
// Slider element
$('div[data-role="fieldcontain"] div[role="application"]').addClass('custom-slider-element');
// Slider button
$('div[data-role="fieldcontain"] div[role="application"] a span').addClass('custom-slider-button');

jQuery Mobile addClass不会影响样式

3 个答案: