0

我在 http://dev.jtsage.com/jQM-DateBox2/demos/fullopt.html 使用 jquery mobile datebox 特别是我在http://dev.jtsage.com/cdn/datebox/ 使用 calbox选项1.1.0/jqm-datebox-1.1.0.mode.calbox.js

我需要拦截当您单击某一天时触发的单击事件，然后执行一些自定义操作（例如更改该日期的背景颜色）。这样做的最佳方法是什么？我尝试为元素 $('div.ui-datebox-griddate.ui-corner-all.ui-btn-up-d') 注册一个单击事件，但这似乎不起作用。

我正在使用backbonejs，并且coffeescript中类的相关部分看起来像（SimpleView扩展Backbone.View）：

class A extend SimpleView
  ....
  events: {    
    'click div.ui-datebox-griddate.ui-corner-all.ui-btn-up-d': "clicked"  
  }  

  clicked: (event) ->
    console.log 'clicked'

上面的方法不起作用，而且这可能不是做我想做的最好的方法，因为它依赖于内部类名来创建点击事件。

提前致谢！

4

2 回答 2

2

Datebox 触发一个名为“datebox”的自定义事件（足够有创意）。单击一天时会触发该事件三次，但更重要的是，它会将第二个参数传递给包含有关单击日期的详细信息的事件。

试一试：

....
events: {
    'datebox' : 'clicked'
},

clicked: function(e, eventDetail) {
    // Of the three event triggers, "method" varies, so I checked for "set"
    if (eventDetail.method == "set") {
        var jsDateObj = eventDetail.date;
        console.log(jsDateObj);
    }
}
....
于 2013-02-16T04:48:19.543 回答
0

我想我找到了一种方法来做到这一点。而不是在“day”元素上创建一个点击 - 在日历附加到的输入日期字段上创建一个。从那里您可以获取内容并将其用作过滤器以获取正确的日历日元素，此时您可以使用 css 样式做任何您想做的事情。相关代码片段如下...

class A extend SimpleView
  ....
   events: {    
     'change #mydate': "clicked"  
   }   
   clicked: (event) ->
     t = $(event.target)
     day = t.data('datebox').theDate.getDate()
     dayFilter= "div.ui-datebox-griddate.ui-corner-all:contains('#{day}')"
     $(dayFilter).filter( ->
       thisDay = parseInt($(@).text())
       if thisDay == day
         # do your css magic here
     )
于 2013-02-15T14:19:38.050 回答