全球设置jquery移动到迷你

我想全球设置我的jquery移动应用程序中的每个元素，以支持数据迷你使用它。有没有一种全球性的方式来做到这一点，不必为每个元素添加data-mini ='true'到html？全球设置jquery移动到迷你

2012-10-27 chrisp_68

它是一个注册feature request，见Ability to use data-mini by default or on an entire container。

这意味着，用当前版本可以做的最好的就是你所说的，为所有表单元素添加属性。

假设移动页面不会有很多的元素，我不会说这是一个问题的所有：

$('form *').data('mini', true);

来源

2012-10-27 19:39:51

嗨，谢谢你的回应。我已经尝试过你建议的内容，并将data-mini =“true”添加到了标记中，但实际的控件并没有变小。奇！ –

在我测试之前意外地提出了upvoted :-(...它至少不适用于jQuery 1.10.2/FF 31.0：在Firebug/HTML视图中我看不到添加的属性，但我可以在DOM中找到它或者通过查询，但即使是'$（'＃mypanel'）。enhanceWithin（）'也没有帮助（'div＃mypanel'包装按钮）。 –

今天我遇到了类似的问题。作为屏幕分辨率检测的一部分，我的要求是可以随时更改为迷你版本。无论如何，$('form *').data('mini', true);也没有为我工作，但我有一个解决方法，但恼人的是。我有三个元素，我需要'迷你'。一个按钮，一个文本输入（嗯，真的是一个电子邮件输入）和一个文本区域。

对于按钮，我能够使用$('button').buttonMarkup({mini: true});我使用开发人员JS控制台验证它确实工作。从那里我还发现在jquerymobile文档$('textinput').textinput({mini: true})，但是这不适用于我。

最后，在学习DOM之后，我尝试在文本输入和文本区域中简单地添加类“ui-mini”，它似乎工作。

所以总结起来：

$('button').buttonMarkup({mini: true}); 
$('input').addClass('ui-mini'); 
$('textarea').addClass('ui-mini');

来源

2012-11-15 21:44:34 Rakshasas

我使用jQuery Mobile的1.4.5，和下面的是最简单的答案：

var $widgets = $.mobile.widgets; 

$.each($widgets, function(widget) { 
    $widgets[widget].prototype.options.mini = true; 
});

一切都很好，但。 .. listview不作任何更改。

所以我要补充：

$('ul[data-role=listview]').find('a').addClass('ui-mini');

上面所添加的代码是如此的丑陋，我有这个替代它：

<ul data-role="listview"> 
    <li> 
     <a class="ui-mini">Hello World</a> 
    </li> 
</ul>

只需添加ui-mini上课手动，不错，多手一些^ o^

来源

2015-10-30 08:56:02

全球设置jquery移动到迷你

回答

相关问题