mobiScroll - 单击额外按钮时重置轮子的值

Question

我正在尝试向 mobiscroll 滚动条添加第三个功能。首先是一些解释：我有 4 个自定义创建的轮子，从“0”到“9”。用户可以在此处插入一个 4 位数字。

除了标准的“取消”（“Abbrechen”）和“添加”（“OK”）按钮之外，我还想实现一个重置（“Bestand”）按钮，它将滚动器内的所有轮子设置为值“ 0”。添加这个额外的按钮没有任何问题，但不幸的是添加了想要的功能。想要的功能应该将所有 4 个轮子的值重置为值“0”。到目前为止遵循我的代码：

启动轮子......

var whl1 = {'1':'1',
         '2':'2', 
         '3':'3',
         '4':'4', 
         '5':'5', 
         '6':'6',
         '7':'7',
         '8':'8',
         '9':'9',
         '0':'0'};

var whl2 = {'1':'1',
         '2':'2', 
         '3':'3',
         '4':'4', 
         '5':'5', 
         '6':'6',
         '7':'7',
         '8':'8',
         '9':'9',
         '0':'0'};

var whl3 = {'1':'1',
         '2':'2', 
         '3':'3',
         '4':'4', 
         '5':'5', 
         '6':'6',
         '7':'7',
         '8':'8',
         '9':'9',
         '0':'0'};

var whl4 = {'1':'1',
         '2':'2', 
         '3':'3',
         '4':'4', 
         '5':'5', 
         '6':'6',
         '7':'7',
         '8':'8',
         '9':'9',
         '0':'0'};

 var wheel = [{},{},{},{}];
 wheel[0]['1000er'] = whl1;
 wheel[1]['100er'] = whl2;
 wheel[2]['10er'] = whl3;
 wheel[3]['1er'] = whl4;

初始化滚动条......（在循环中）......

$('#' + i +'').scroller({
  display: 'modal',
  mode: 'clickpick',
  lang : 'de',
  headerText: function(value)   {
      //Some Stuff in here  
      },
  button3Text: "Bestand",
  button3: function(){
         // this function doesn't work................
         $('#' + i +'').mobiscroll('setValue', ['0', '0', '0', '0']);
  },
  formatResult: function(data) {
     // some other stuff in here
      },
  onSelect: function(valueText, inst) {
    // some other stuff, too
  },
  wheels: wheel,
  height: 40
    });   

我尝试了很多方法来实现该功能，但没有任何效果....有没有人有想法，我该如何解决这个问题？因为我已经浪费了很多时间来解决这个问题（2 整天......），我将非常感谢每一个回应或一点提示......提前感谢，祝您度过愉快的一周！

Answer 1

我认为在 button3 函数中 i 的值总是相同的，不记得它在循环中的值。

您可以尝试使用 jquery 循环遍历元素，如下所示：

HTML：

<input id="t1" class="mobiscroll" />
<input id="t2" class="mobiscroll" />
<!-- .... -->

Javascript：

$('.mobiscroll').each(function() {
    var that = $(this);

    that.mobiscroll({
        display: 'modal',
        mode: 'clickpick',
        lang : 'de',
        headerText: function(value)   {
            //Some Stuff in here  
        },
        button3Text: "Bestand",
        button3: function(){
            // this function doesn't work................
            that.mobiscroll('setValue', ['0', '0', '0', '0']);
        },
        onSelect: function(valueText, inst) {
            // some other stuff, too
        },
        wheels: wheel,
        height: 40
    });
});