Question

我正在尝试添加一些代码，只要用户在Sencha touch中单击某个面板中的某个单选按钮选项，就会调用这些代码。我通过向面板主体添加一个单击监听器并只检查目标并确保它是一个单选按钮（有一个值）来实现它。

我确信有更好的方法来绑定这个处理程序。我已经看了一些关于听众的教程，从我的理解“我做错了”。但是我在哪里可以找到有关正确做法的信息？这是我正在做的精简版，使用Sencha Touch 1.1.0（这是应用程序javascript文件）：

Ext.setup({
    onReady: function() {
        panel = new Ext.Panel({
            fullscreen: true,
            title: 'Test',
            scroll: 'vertical',
            items: [{
                xtype: 'fieldset',
                defaults: {
                    xtype: 'radiofield',
                    labelWidth: '80%',
                    name: 'opt',
                },
                items: [{label: 'first', value: 1}, {label: 'second', value: 2}]
            }],
        });

        panel.addListener({
            body: {
                click: function(ctl) {
                    if (ctl && ctl.target && ctl.target.value) {
                        console.log('checked control ' + ctl.target.value);
                    }
                }
            }
        });
    }
});

我假设我应该做的是绑定到fieldset而不是body，并且可能正在侦听change事件而不是click事件。但是除了这个之外我尝试过的所有表格似乎都不起作用。

Answer 1

我已经制作了一个看起来像这样的版本：

panel = new Ext.Panel({
    fullscreen: true,
    title: 'Test',
    scroll: 'vertical',
    items: [{
        xtype: 'fieldset',
        defaults: {
            xtype: 'radiofield',
            labelWidth: '80%',
            name: 'opt',
        },
        items: [{label: 'first', value: 1}, {label: 'second', value: 2}]
    }],
    listeners: {
        el: {
            tap: function(ctl) {console.log("Checked " + ctl.target.value);},
            delegate: "input",
        }
    },
});

我怀疑有一种方法可以将它附加到fieldset元素而不是面板，但这比我的替代品好很多。我不再需要检查传递给click事件处理程序的目标项，看它是否是一个单选按钮，委托设置负责处理。现在，当我动态地将项添加到字段集时，处理程序可以正常工作。

Answer 2

您可以尝试将侦听器添加到您的radiofield项目，或者像您所说的那样，添加到fieldset。这适用于无线电场项目：

items: [{
    label: 'first',
    value: 1,
    listeners: {
        check: function(button) {
            console.log('...');
        }
    }
}, {
    label: 'second',
    value: 2,
    listeners: {
        check: function(button) {
            console.log('...');
        }
    }
}]

Answer 3

您可以将侦听器添加到原始脚本的默认部分，如下所示：

xtype: 'radiofield',  
        listeners: {  
            check: function() {   
            alert(this.value);  
            }  
        },

处理Sencha Touch中单选按钮上的事件

3 个答案: