在Javascript中内联If以操作CSS代码

Question

如果页面宽度小于X像素，我将尝试隐藏日历按钮。似乎有一个不正确的语法问题，但我找不出我做错了什么。这是代码；

'calendars' : {
                    label : Dictionary.Calendar.AddCalendars,
                    icon : 'fa-calendar',
                    showText : false,
                    css : (($('.ak-page').width() < 500px ) ? 'col-xs-hide' : ''),

css下面还有更多的属性，我不打算在这里包括它们，因为我知道问题出在我定义"css"属性的那一行。

Answer 1

500px是无效的JavaScript语法。

由于jQuery的width()方法以整数形式返回像素数，我认为您的意思是：

css : (($('.ak-page').width() < 500 ) ? 'col-xs-hide' : '')

或者，如果您可以支持window.matchMedia，您可以通过检查屏幕的宽度而不是DOM中任意元素的宽度来更可靠地实现这一点：

css : (window.matchMedia('(max-width: 499px)').matches ? 'col-xs-hide' : '')