ExtJS 4 - событие размытия Combo Box запускается дважды - PullRequest
4 голосов
/ 13 октября 2011

У меня есть простой комбобокс с событием размытия. На событие размытия в настоящее время выдается предупреждение для целей тестирования.

Проблема в том, что событие размытия запускается дважды следующим образом:

  1. Если курсор находится в этом поле со списком, и пользователь нажимает клавишу «Tab», из-за чего поле со списком теряет фокус -> событие размытия срабатывает.

  2. После того как выпадающий список потерял фокус, если пользователь щелкает мышью в любом месте экрана, событие размытия снова запускается.

Есть ли какое-либо событие размытия, которое можно запустить только один раз?

Ниже приводится полный код, который я использую:

<html>
    <head>
        <title>Test Page</title>
         <link rel="stylesheet" type="text/css" href="ext-4.0.2a/resources/css/ext-all.css">
         <script type="text/javascript" src="ext-4.0.2a/bootstrap.js"></script>

         <script type='text/javascript'>

            Ext.onReady(function(){

                Ext.define("Post", {
                    extend: 'Ext.data.Model',
                    fields: [
                        {name: 'id', mapping: 'post_id'},
                        {name: 'title', mapping: 'topic_title'},
                        {name: 'topicId', mapping: 'topic_id'},
                        {name: 'author', mapping: 'author'},
                        {name: 'lastPost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp'},
                        {name: 'excerpt', mapping: 'post_text'}
                    ]
                });

                ds = Ext.create('Ext.data.Store', {
                    pageSize: 10,
                    proxy: {
                        type: 'jsonp',
                        url : 'http://www.sencha.com/forum/topics-remote.php',
                        reader: {
                            type: 'json',
                            root: 'topics',
                            totalProperty: 'totalCount'
                        }
                    },
                    model: 'Post'
                });

                panel = Ext.create('Ext.panel.Panel', {
                    renderTo: Ext.getBody(),
                    title: 'Search the Ext Forums',
                    width: 600,
                    bodyPadding: 10,
                    layout: 'anchor',
                    items: [{
                        xtype: 'combo',
                        store: ds,
                        displayField: 'title',
                        fieldLabel:'Blur Test',
                        listeners:{
                            blur:function(){
                                alert('1');
                            }
                        }
                    }, {
                        xtype: 'component',
                        style: 'margin-top:10px',
                        html: 'Live search requires a minimum of 4 characters.'
                    }]
                });
            });
         </script>
    </head>
    <body>

    </body>
</html>

Заранее спасибо за помощь.

PS: я использую ExtJS версии 4.0.2a и проверил это поведение в Firefox, IE9 и IE8. Все они стреляют дважды. Но при включении в Chrome событие вызывается только один раз.

1 Ответ

0 голосов
/ 05 февраля 2012

Один (ОЧЕНЬ УЖАСНЫЙ) вариант - создать переменную для отслеживания вашего размытого счета:

var AlreadyBlurred = false; //Obviously you want to put this somewhere NOT global

Далее вы можете сделать это в вашем listeners объекте:

listeners: {
    blur: function (){
        if(!AlreadyBlurred)
        {
            // Do your code here
        }
        AlreadyBlurred = !AlreadyBlurred;
    }
}

Опять же, это очень ужасная идея, поскольку она, вероятно, маскирует проблему либо в вашем коде, либо в самом Ext.Обновление до 4.0.7, похоже, не помогает (последняя версия jsfiddle показывает, что это все еще происходит).Зачем стрелять по событию размытия из любопытства?Не могли бы вы сделать это при изменении или выбрать вместо этого желаемый результат?

...