javascript - 在 virutemart/Joomla 中通过 rockettheme 在 vm mynxx 模板中使用 AJAX 时出错

Question

在 virtuemart Joomla 1.5 中的 rockettheme 的 vm mynxx 模板中使用下面的脚本时出现错误 -

它在 mynxx 之外工作正常

用户将数据输入 html 表单 - 按下“获取价格”按钮，价格将返回到相同的表单。问题是用户无法提交到购物车

Firebug 错误-

callback is not a function callback(this.responseText);

我的 ajax 脚本

function Ajax() {
    this.instance = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    this.request = function(url, callback) {
        this.instance.open('GET', url, true);
        this.instance.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                callback(this.responseText);
            }
        }
        this.instance.send(null);
    }
}
function validate(form) {
    (new Ajax).request('testform.php?width65=' + form.width65.value + '&length65=' + form.length65.value, function(respons) {
        var prices = eval(respons);
        form.price.value = prices[0];
        form.otherprice.value = prices[1];
    });
}

我想我已经追踪到 theme.js 文件并需要一些代码来验证该功能。

我是新手，这远远超过我 - 任何帮助将不胜感激

Theme.js 代码 - 已打包 - 即 eval(function(p,a,c,k,e,r){e=function(c)...... 我已经解包了

var RokVM = {};
RokVM.autoHide = 3; // seconds before auto closing the Panel


RokVM.Base=
    {
    uri:window.templatePath,start:function()
        {
        RokVM.Base.quantityBox();
        RokVM.Cart.init()
    }
    ,featuredHeight:function(b)
        {
        b=$(b);
        if(!b)
            {
            return RokVM.Base
        }
        var c=b.getElements(".home-featured-inner");
        var d=0;
        c.each(function(a)
            {
            d=Math.max(a.getSize().size.y,d)
        }
        );
        c.setStyle("height",d)
    }
    ,quantityBox:function()
        {
        var h=$$(".cart-quantity-box, .home-featured-cartblock");
        if(h.length)
            {
            h.each(function(b)
                {
                var c=b.getElement(".quantity_box_button_up");
                var d=b.getElement(".quantity_box_button_down");
                var f=b.getElement(".inputboxquantity");
                if(!c||!d||!f)
                    {
                    return
                }
                var g=f.getValue().toInt();
                f.addEvent("keyup",function(e)
                    {
                    e=(new Event(e)).stop();
                    var a=this.value;
                    if(a<0)
                        {
                        a=0
                    }
                    if(isNaN(a))
                        {
                        this.value=1;
                        a=1
                    }
                    if(e.key=="up")
                        {
                        if($type(this.getValue().toInt())=="number")
                            {
                            this.value=++a
                        }
                    }
                    if(e.key=="down")
                        {
                        if(a>0&&$type(this.getValue().toInt())=="number")
                            {
                            this.value=--a
                        }
                    }
                }
                );
                f.addEvent("mousewheel",function(e)
                    {
                    e=(new Event(e)).stop();
                    var a=this.value;
                    if(a<0)
                        {
                        a=0
                    }
                    if(isNaN(a))
                        {
                        this.value=1;
                        a=1
                    }
                    if(e.wheel==1)
                        {
                        if($type(this.getValue().toInt())=="number")
                            {
                            this.value=++a
                        }
                    }
                    if(e.wheel==-1)
                        {
                        if(a>0&&$type(this.getValue().toInt())=="number")
                            {
                            this.value=--a
                        }
                    }
                }
                );
                c.addEvent("click",function(e)
                    {
                    (new Event(e)).stop();
                    if($type(f.getValue().toInt())=="number")
                        {
                        f.value=++f.value
                    }
                }
                );
                d.addEvent("click",function(e)
                    {
                    (new Event(e)).stop();
                    if(f.getValue().toInt()>0&&$type(f.getValue().toInt())=="number")
                        {
                        f.value=--f.value
                    }
                }
                )
            }
            )
        }
    }
};
RokVM.Cart=
    {
    init:function()
        {
        RokVM.Cart.cartPanel=$("cart-panel");
        RokVM.Cart.cartButton=$("cart-button");
        RokVM.Cart.cartSurround=$("cart-panel-surround");
        if(!RokVM.Cart.cartPanel||!RokVM.Cart.cartButton||!RokVM.Cart.cartSurround)
            {
            return RokVM.Cart
        }
        if(!RokVM.Cart.Fx)
            {
            RokVM.Cart.Fx=(new(Fx.Slide)(RokVM.Cart.cartPanel,
                {
                duration:400,transition:Fx.Transitions.Expo.easeOut
            }
            )).hide()
        }
        RokVM.Cart.cartSurround.setStyle("visibility","visible");
        RokVM.Cart.cartButton.getFirst("a").addEvent("click",function(e)
            {
            (new Event(e)).stop();
            if(!RokVM.Cart.cartPanel.getText().length&&!window.webkit)
                {
                return
            }
            if(!RokVM.Cart.cartPanel.innerHTML.clean().length&&window.webkit)
                {
                return
            }
            var a=RokVM.Cart.cartButton.getElement("strong");
            if(!a||!a.getText().toInt()&&(!RokVM.Cart.cartPanel.getText().length&&!window.webkit))
                {
                return
            }
            RokVM.Cart.clicked=true;
            if(window.fontFx&&window.fontFx.open)
                {
                window.fontFx.toggle()
            }
            if(window.loginFx&&window.loginFx.open)
                {
                window.loginFx.toggle()
            }
            RokVM.Cart.Fx.toggle()
        }
        );
        RokVM.scrollWindow=new(Fx.Scroll)(window);
        RokVM.Cart.getShortList();
        RokVM.Cart.XHRify()
    }
    ,XHRify:function()
        {
        var b=$$(".addtocart_form");
        if(!b.length)
            {
            return RokVM.Cart
        }
        b.each(function(a)
            {
            a.addEvent("submit",RokVM.Cart.add.bindWithEvent(a,true))
        }
        )
    }
    ,add:function(e,c)
        {
        (new Event(e)).stop();
        (new Ajax(this.getProperty("action"),
            {
            data:$(this),evalScripts:true,onComplete:function(r)
                {
                var a=new Element('div').setHTML(r);
                var b=a.getElement('.shop_tip');
                RokVM.Cart.getShortList((r.length&&b)?r:false);
                RokVM.Cart.clicked=c||false
            }
        }
        )).request()
    }
    ,getShortList:function(b)
        {
        var c=
            {
            onComplete:function(a)
                {
                RokVM.Cart.update(a,b)
            }
            ,evalScripts:true,data:
                {
                only_page:1,page:"shop.basket_short",option:"com_virtuemart"
            }
        };
        (new Ajax(RokVM.Base.uri+"index2.php",c)).request()
    }
    ,handleError:function(a)
        {
        var b=RokVM.Cart.cartPanel;
        var c=new Element('div').setHTML(a);
        var d=b.getElement('.show-cart-button');
        var e=c.getElement('.shop_tip').inject((d)?d:b,(d)?'before':'inside')
    }
    ,update:function(a,b)
        {
        RokVM.Cart.cartPanel.setHTML(a);
        var c=RokVM.Cart.cartPanel.getElement(".total_products"),total=0;
        if(c)
            {
            total=c.innerHTML.split(" ")[0].toInt()
        }
        if(!total)
            {
            RokVM.Cart.cartButton.getFirst().setProperty("class","cart-button-desc")
        }
        else
            {
            RokVM.Cart.cartButton.getFirst().setProperty("class","cart-button-desc-full")
        }
        RokVM.Cart.cartButton.getElement("strong").setText(total);
        if(b)RokVM.Cart.handleError(b);
        if(RokVM.Cart.clicked&&a.length||b)
            {
            if(window.fontFx&&window.fontFx.open)
                {
                window.fontFx.toggle()
            }
            if(window.loginFx&&window.loginFx.open)
                {
                window.loginFx.toggle()
            }
            RokVM.scrollWindow.toTop();
            RokVM.Cart.show();
            RokVM.Cart.hide.delay(RokVM.autoHide*1000)
        }
        RokVM.Cart.clicked=false
    }
    ,show:function()
        {
        RokVM.Cart.Fx.slideIn()
    }
    ,hide:function()
        {
        RokVM.Cart.Fx.slideOut()
    }
};
window.addEvent("domready",RokVM.Base.start);
window.addEvent(window.webkit?"load":"domready",function()
    {
    RokVM.Base.featuredHeight("home-featured")
}
);
var live_site = RokVM.Base.url;

然后是 - 在同一个 theme.js 文件中(未打包)

/// Following is VM stuff, kept for compatibility


/**
 * This file holds javascript functions that are used by the templates in the Theme
 * 
 */

 // AJAX FUNCTIONS 
function loadNewPage( el, url ) {

    var theEl = $(el);
    var callback = {
        success : function(responseText) {
            theEl.innerHTML = responseText;
            if( Lightbox ) Lightbox.init();
        }
    }
    var opt = {
        // Use POST
        method: 'get',
        // Handle successful response
        onComplete: callback.success
    }
    new Ajax( url + '&only_page=1', opt ).request();
}

function handleGoToCart() { document.location = live_site + '/index.php?option=com_virtuemart&page=shop.cart&product_id=' + formCartAdd.product_id.value ; }

function handleAddToCart( formId, parameters ) {
    formCartAdd = document.getElementById( formId );

    var callback = function(responseText) {
        updateMiniCarts();
        // close an existing mooPrompt box first, before attempting to create a new one (thanks wellsie!)
        /*if (document.boxB) {
            document.boxB.close();
            clearTimeout(timeoutID);
        }

        document.boxB = new MooPrompt(notice_lbl, responseText, {
                buttons: 2,
                width:400,
                height:150,
                overlay: false,
                button1: ok_lbl,
                button2: cart_title,
                onButton2:  handleGoToCart
            });

        setTimeout( 'document.boxB.close()', 3000 );*/
    }

    var opt = {
        // Use POST
        method: 'post',
        // Send this lovely data
        data: $(formId),
        // Handle successful response
        onComplete: callback,

        evalScripts: true
    }

    new Ajax(formCartAdd.action, opt).request();
}
/**
* This function searches for all elements with the class name "vmCartModule" and
* updates them with the contents of the page "shop.basket_short" after a cart modification event
*/
function updateMiniCarts() {
    var callbackCart = function(responseText) {
        carts = $$( '.vmCartModule' );
        if( carts ) {
            try { 
                for (var i=0; i<carts.length; i++){
                    carts[i].innerHTML = responseText;

                    try {
                    color = carts[i].getStyle( 'color' );
                    bgcolor = carts[i].getStyle( 'background-color' );
                    if( bgcolor == 'transparent' ) {
                        // If the current element has no background color, it is transparent.
                        // We can't make a highlight without knowing about the real background color,
                        // so let's loop up to the next parent that has a BG Color
                        parent = carts[i].getParent();
                        while( parent && bgcolor == 'transparent' ) {
                            bgcolor = parent.getStyle( 'background-color' );
                            parent = parent.getParent();
                        }
                    }
                    var fxc = new Fx.Style(carts[i], 'color', {duration: 1000});
                    var fxbgc = new Fx.Style(carts[i], 'background-color', {duration: 1000});

                    fxc.start( '#222', color );                         
                    fxbgc.start( '#fff68f', bgcolor );



                    if( parent ) {
                        setTimeout( "carts[" + i + "].setStyle( 'background-color', 'transparent' )", 1000 );
                    }
                    } catch(e) {}
                }
            } catch(e) {}
        }
    }
    var option = { method: 'post', onComplete: callbackCart, data: { only_page:1,page: "shop.basket_short", option: "com_virtuemart" } }
    new Ajax( live_site + '/index2.php', option).request();
}
/**
* This function allows you to present contents of a URL in a really nice stylish dhtml Window
* It uses the WindowJS, so make sure you have called
* vmCommonHTML::loadWindowsJS();
* before
*/
function fancyPop( url, parameters ) {

    parameters = parameters || {};
    popTitle = parameters.title || '';
    popWidth = parameters.width || 700;
    popHeight = parameters.height || 600;
    popModal = parameters.modal || false;

    window_id = new Window('window_id', {className: "mac_os_x", 
                                        title: popTitle,
                                        showEffect: Element.show,
                                        hideEffect: Element.hide,
                                        width: popWidth, height: popHeight}); 
    window_id.setAjaxContent( url, {evalScripts:true}, true, popModal );
    window_id.setCookie('window_size');
    window_id.setDestroyOnClose();


}

Answer 1

我真的不知道这个模板，但我认为 function callback() 是应该在它的代码中指定的东西，以便在服务器 (HTTP 200) 有肯定响应时使用react，那么你也可以给我们:

1. 那个函数
2. 它是本地化的(即，它是否位于同一个文件中)
3. 以及加载到 DOM 时:在函数 Ajax() 之前或之后{}