2

我需要在通过 Prototype 的 Scriptaculous' Ajax.Autocompleter完成的 Ajax 请求上添加一个旋转轮（加载条） 。但不幸的是，我从未使用过这些框架……在这种情况下，没有办法切换到 jQuery……文档很差，在网上找不到任何东西。

下面的代码是 Magento js.js 文件（http://pastebin.com/UUAEEAkR）第 339 行的一部分（我试图在 onShow 之前添加一个 onLoading 但什么也没发生......所以我真的不知道该做什么做 ）

initAutocomplete : function(url, destinationElement){
    new Ajax.Autocompleter(
        this.field,
        destinationElement,
        url,
        {
            paramName: this.field.name,
            method: 'get',
            minChars: 2,
            updateElement: this._selectAutocompleteItem.bind(this),
            onShow : function(element, update) {
                Effect.Appear(update,{duration:0});
            }

        }
    );
},
4

1 回答 1

3

实际上，这很容易做到。你在做什么是错误的。您不必使用 onLoading 等。

您所要做的就是在之后添加minChars: 2

•频率：0.5 = 自动完成器检查输入是否有更改的时间

• indicator: 'searching' = 是 ajax 运行时应该显示的 div 的 ID。

所以它变成了

initAutocomplete : function(url, destinationElement){
    new Ajax.Autocompleter(
        this.field,
        destinationElement,
        url,
        {
            paramName: this.field.name,
            method: 'get',
            minChars: 1,
            frequency: 0.5, // NOTICE THIS
            indicator: 'searching', // AND THIS
            updateElement: this._selectAutocompleteItem.bind(this),
            onShow : function(element, update) {
                Effect.Appear(update,{duration:0});
            }

        }
    );
},

所以在你之后，我猜是form.mini.phtml但你可以放在你想要的地方（不要忘记设置样式等）...转到：app/design/frontend/default/[THEME NAME]/template/catalogsearch/form.mini.phtml并在输入后添加以下代码：

<div id="searching" style="display: none;">
    <img alt="" src="ajax-loader.gif">
</div>

而已。

于 2013-09-05T10:42:50.797 回答