-1

ジャバスクリプト

JEASearch = new Class({

Implements: [Options],

        form: null,

        forceUpdateLists : false,

        options: {
            fields : {
                filter_search : "",
                filter_area_id : 0,
                filter_department_id : 0,
                filter_town_id : 0
            },
            useAJAX : true
        },


        initFieldBehavior : function(fieldName) {
            if (this.form[fieldName]) {
                if (typeOf(this.form[fieldName]) == 'element') {
                    var field = document.id(this.form[fieldName]);
                    field.addEvent('change', function(event) {
                        this.forceUpdateLists = false;
                        this.options.fields[fieldName] = field.get('value');
                        this.refresh();
                    }.bind(this));

                } else if (typeOf(this.form[fieldName]) == 'collection') {
                    if (fieldName == 'filter_amenities[]') {
                        Array.from(this.form['filter_amenities[]']).each(function(item) {
                            item.addEvent('change', function(event) {
                                var index = this.options.fields.filter_amenities.indexOf(item.get('value'));
                                this.forceUpdateLists = true;
                                if (item.get('checked') && index == -1) {
                                    this.options.fields.filter_amenities.push(item.get('value'));
                                } else if (!item.get('checked') && index > -1){
                                    this.options.fields.filter_amenities.splice(index, 1);
                                }
                                this.refresh();
                            }.bind(this));
                        }.bind(this));
                    } else if (fieldName == 'filter_transaction_type') {
                        Array.from(this.form['filter_transaction_type']).each(function(item) {
                            item.addEvent('change', function(event) {
                                this.forceUpdateLists = true;
                                if (item.get('checked')) {
                                    this.options.fields.filter_transaction_type = item.get('value');
                                }
                                this.refresh();
                            }.bind(this));
                        }.bind(this));
                    }
                }
            }
        },

        refresh: function() {
            if (this.options.useAJAX) {
                var jSonRequest = new Request.JSON({
                    url: 'index.php?option=com_jea&task=properties.search&format=json',
                    onSuccess: function(response) {
                        this.appendList('filter_area_id', response.areas);
                        this.appendList('filter_department_id', response.departments);
                        this.appendList('filter_town_id',response.towns);

                        this.form.getElements('.jea-counter-result').each(function(item){
                            item.set('text', response.total);
                        });
                    }.bind(this)
                });

                jSonRequest.post(this.options.fields);
            }
        },

        reset : function() {
            this.options.fields = {
                filter_search : "",
                filter_area_id : 0,
                filter_department_id : 0,
                filter_town_id : 0

            };

            for (var fieldName in this.options.fields) {
                if (this.form[fieldName]) {
                    if (typeOf(this.form[fieldName]) == 'element') {
                        var field = document.id(this.form[fieldName]);
                        if (field.get('tag') == 'select') {
                            field.set('selectedIndex', 0);
                        }
                        field.set('value', '');

                    } else if (typeOf(this.form[fieldName]) == 'collection') {
                        Array.from(this.form[fieldName]).each(function(item) {
                            item.set('checked', '');
                        });
                    }
                }
            }

            this.refresh(fast);
        },

        appendList : function(selectName, objectList) {
            if (this.form[selectName]) {
                var selectElt = document.id(this.form[selectName]);
                // Update the list only if its value equals 0
                // Or if this.forceUpdateLists is set to true
                if (selectElt.get('value') == 0 || this.forceUpdateLists) {
                    var value = selectElt.get('value');

                    // Save the first option element
                    var first = selectElt.getFirst().clone();
                    selectElt.empty();
                    if (first.get('value') == 0) {
                        selectElt.adopt(first);
                    }

                    for (var i in objectList) {
                        if (objectList[i].text) {
                            var option = new Element('option', objectList[i]);
                            if (objectList[i].value == value) {
                                option.setProperty('selected', 'selected');
                            }
                            selectElt.adopt(option);
                        }
                    }
                }
            }
        }

    });

上記のコードは、私のサイトの検索バーで機能します。州/地区/市を選択すると、選択したコンテンツが開くのが非常に遅くなり、検索ボタンをクリックせずに別の州を選択すると、地区と都市を開くのに時間がかかります...
上記のJAVASCRIPTコードを貼り付けました。その理由を教えてください。

私のサイト

4

1 に答える 1

0

Chrome Dev Toolsの[ネットワーク]タブを見ると、サーバーに対して遅滞なく行われたリクエストが記録されていますが、サーバーの応答はそれほど速くありません。私の接続では、応答ごとに約500ミリ秒を取得し、最大で2秒を超えていました。

サーバー側のコードをプロファイリングします。PHPを使用しているようです。

PHPスクリプトをプロファイリングする最も簡単な方法

于 2013-02-18T05:56:31.347 に答える