如何使 jQueryUI 图标显示为禁用?
有没有办法禁用 jquery 中的图标?例如,我使用 ui-icon-circle-triangle-w 和 ui-icon-circle-triangle-e 表示“上一个/下一个”,我想在列表开头时禁用“上一个”,在列表开头时禁用“下一个”结束等
Is there a way to disable the icons in jquery? For example I am using ui-icon-circle-triangle-w and ui-icon-circle-triangle-e for "prev/next" and I would like to disable "prev" when at the beginning of the list and next when at the end etc.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(6)
我想这应该是显而易见的,但它并没有出现在有关如何使用图标的主要文档中。您只需将
ui-state-disabled
类添加到该元素即可。例如,要通过 JavaScript 执行此操作,您可以这样做:I guess this should have been obvious but it wasn't in the main documentation on how to use the icons. You just add the class
ui-state-disabled
to the element. So for example to do it through JavaScript you might do:您可以将 .ui-icon 设置为不显示,这也会隐藏图标。您可能需要也可能不需要“!重要”部分。
You can set .ui-icon to not display, which should also hide the icons. You may or may not need the "!important" part.
这是旧的,但我今天遇到了,所以我想我会把它清理干净。 .addClass('ui-state-disabled') 将应用 css 以使其具有禁用的外观。但如果您有绑定到图标的事件,它仍然会触发。你还必须确保你的 js 知道它何时被禁用。也许使用 if hasClass('ui-state-disabled')。但仅添加 css 类并不会“禁用”图标。
This is old but I ran into today so I figured I would clean it up. .addClass('ui-state-disabled') will apply the css to give it that disabled look. But if you have events bound to the icon it will still fire. You also have to make sure your js knows when its disabled. Maybe using if hasClass('ui-state-disabled'). But just adding the css class doesn't "disabled" the icon.
如果您想保留对角线“se”手柄而不使用图标,最好是:
If you want to keep the diagonal "se" handle without the icon the best is :
您可以在元素上添加 css
opacity:0.7
。我认为这不仅对文本有用,而且对元素中的图标或其他元素也有用。我写了一个 DEMO
关键组件是:
... 而这个 DEMO 带图标
You can add css
opacity:0.7
on your element. I think this is useful not only for text but also for the icon or other element in your element.I wrote a DEMO
The key component is:
... and this DEMO with icon
您无法禁用它们,因为它们不是“html”元素,因此最好的方法是使用“unbind()”方法,例如: $('#icon-plus-sign').unbind('click');
you can't disable them because they are not 'html' elements so the best way is by using 'unbind()' method like: $('#icon-plus-sign').unbind('click');