将商品添加到购物车的JavaScript已损坏

Question

我有一个按钮,它是我的Magento主题中提供的代码的一部分,根据日期/时间戳,我没有无意中编辑它.我确信它在某个时刻正在工作,但在上周回顾了我的源代码控制,我似乎无法追踪出错的地方.

这是HTML按钮:

<button type="button" title="Add to Cart" class="button btn-cart" onclick="productAddToCartForm.submit(this)"><span><span>Add to Cart</span></span></button>

...但是当我点击它时没有任何反应.看起来非常直接,除了我看不到是否/哪里有拼写错误等等.所以,我检查Firebug,我看到以下错误:

但是,当我转到"查看页面源"时,脚本确实在页面中:

<script type="text/javascript">
//<![CDATA[
    var productAddToCartForm = new VarienForm('product_addtocart_form');
    productAddToCartForm.submit = function(button, url) {
        if (this.validator.validate()) {
            var form = this.form;
            var oldUrl = form.action;

            if (url) {
               form.action = url;
            }
            var e = null;
            try {
                this.form.submit();
            } catch (e) {
            }
            this.form.action = oldUrl;
            if (e) {
                throw e;
            }

            if (button && button != 'undefined') {
                button.disabled = true;
            }
        }
    }.bind(productAddToCartForm);

    productAddToCartForm.submitLight = function(button, url){
        if(this.validator) {
            var nv = Validation.methods;
            delete Validation.methods['required-entry'];
            delete Validation.methods['validate-one-required'];
            delete Validation.methods['validate-one-required-by-name'];
            if (this.validator.validate()) {
                if (url) {
                    this.form.action = url;
                }
                this.form.submit();
            }
            Object.extend(Validation.methods, nv);
        }
    }.bind(productAddToCartForm);
//]]>
</script>

Answer 1

该$变量与正在使用的其他 JavaScript 库冲突。删除 jQuery 库的包含应该会恢复其他功能，以证明这就是问题所在。

为了修复它，请重写 jPlayer 代码（替换$为jQuery），或尝试使用该jQuery.noConflict()函数。

即，这个： $(document).ready(function(){...

...变成： jQuery(document).ready(function(){...

更多详细信息可以在jQuery.noConflict()文档中找到。

在我上面问题的这个特定示例中，我通过使用noConflict()以下方式解决了它：

$.noConflict();
jQuery(document).ready(function(){
  jQuery("#jquery_jplayer").jPlayer({
    ready: function () {      
      jQuery(this).jPlayer("setMedia", {
        mp3: jQuery('#jquery_jplayer').attr('media_file')
      });
    },
    swfPath: "/js/jplayer",
    supplied: "mp3"
  });
});