原型的 Java 脚本错误

Question

我从我的 magento 项目中收到如下 js 错误。我的项目 url 是 check my project。我认为这是原型 js 的错误。我尝试了 js noconflict 但没有用。

错误：

未捕获的类型错误：（中间值）（中间 值）（中间值）（中间值）（中间值）是 不是函数 www.bigzaar.com/:1 Uncaught ReferenceError: jQuery is 未定义 www.bigzaar.com/:93 Uncaught ReferenceError: jQuery is not 定义 www.bigzaar.com/:151 Uncaught ReferenceError: jQuery is not 定义 www.bigzaar.com/:157 Uncaught ReferenceError: jQuery is not 定义 www.bigzaar.com/:420 Uncaught ReferenceError: jQuery is not 定义 jquery.mobile.customized.min.js:10 Uncaught ReferenceError: jQuery 未定义 camera.js:2238 Uncaught ReferenceError: jQuery 未定义 www.bigzaar.com/:607 Uncaught ReferenceError: jQuery is 未定义 www.bigzaar.com/:704 Uncaught ReferenceError: jQuery is 未定义 www.bigzaar.com/:863 Uncaught ReferenceError: jQuery is 未定义

我的 js 文件

/********Javascript for FREE TEXT SEARCH ************/
var Quicksearch = Class.create();
var idSearchInput = '';
Quicksearch.prototype = {
    initialize: function(searchUrl,resultNotice,idSearchInput){
        this.idSearchInput = idSearchInput;
        this.searchUrl = searchUrl;     
        this.onSuccess = this.onSuccess.bindAsEventListener(this);        
        this.onFailure = this.onFailure.bindAsEventListener(this);              
        this.currentSearch = '';    
        this.resultNotice = resultNotice;
    },
    search: function(){ 
        var searchBox = $(this.idSearchInput);

        if(searchBox.value=='')
        {
            return;
        }

        if ((this.currentSearch!="") &&(searchBox.value == this.currentSearch)) {
            return;
        }
        this.currentSearch = searchBox.value;

        searchBox.className =  'loading-result input-text';
        var keyword = searchBox.value;


        url = this.searchUrl+"keyword/" + escape(keyword);

        new Ajax.Request(url, {
              method: 'get',         
              onSuccess: this.onSuccess,

              onFailure: this.onFailure 
          });    
    },
    onFailure: function(transport){
        $(this.idSearchInput).className ="input-text";
    },
    onSuccess: function(transport)
    {
        var showResults = $('showResults');
        showResults.style.display = "block";
        var listResults = $('listResults');
        listResults.style.display = "block";
        var searchBox = $(this.idSearchInput);
        if (transport && transport.responseText) {
            try{
                response = eval('(' + transport.responseText + ')');
            }
            catch (e) {
                response = {};
            }

            if (response.html != "") {
                this.currentSearch = searchBox.value;
                listResults.update(response.html);
                var searchResultNotice = this.resultNotice;
                var strNotice = searchResultNotice.replace("{{keyword}}",this.currentSearch);
                this.updateResultLabel(strNotice);
                searchBox.className = 'search-complete input-text';
            }
            else
            {
                listResults.update(response.html);
                this.updateResultLabel('No results for "<span class="keyword">'+this.currentSearch+'</span>"');
                searchBox.className ="search-complete input-text";
            }           
        }       
    },
    updateResultLabel: function(message)
    {
        $("resultLabel").update(message);
    }
}

我的js调用函数

<script type="text/javascript">
    var quicksearch = new Quicksearch(
        '<?php echo $this->getUrl('freetextsearch/search/quicksearch') ?>',
        '<?php echo $resultNotice ?>',
        'input_search'
    );
    var numberChar = <?php echo Mage::getStoreConfig('freetextsearch/quick_search_setting/number_character')?>;
    Event.observe('input_search', 'keyup', function(event){
        var searchBox = $('input_search');
        if(searchBox.value.length >= numberChar){
            quicksearch.search();
        }   
    });
    function closeDropdown() {
        var showResults = $('showResults');
        showResults.style.display = "none";
    }
</script>

请帮我解决这个错误。任何帮助都会很明显

Answer 1

使用 Chrome 调试器控制台并在 Sources 面板中启用“Pause on exceptions”。 Chrome 会直接向您显示发生异常的行。如果没有，则重新加载页面一次或两次（如果脚本在模板中的某处内联并且您在 Opera 或其他一些基于 Webkit 的浏览器中使用此调试器，则这是必要的，而在 Chrome 中，即使对于内联脚本，它也大部分时间都可以工作)。

我看到您在包含 jQuery 1.8 之前尝试使用 jQuery。确保在包含 jQuery 库之前不要使用 jQuery。

在缩小的 jQuery 1.8 库中抛出异常。目前还不清楚究竟是什么导致 jQuery 1.8 lib 引发异常，我建议您包含未压缩的版本，以便您可以查看异常发生的确切位置。我还看到压缩版本的 jQuery 抛出异常，而未压缩版本在 Magento 中没有。使用未压缩版本可以神奇地“解决”您的问题，但压缩版本无法正常工作主要暗示 jQuery 或原型脚本之间存在某种冲突。

确保您不使用包含 jQuery 脚本的扩展。一页中多个jQuery版本会导致冲突，也可以通过noconflict来解决..

根据我的经验，最好在 head.phtml 中包含一次用于所有用途的 jquery，然后添加 jQuery.noconflict()。然后通过布局 xml 一次包含所有 magento 原型脚本，然后添加任何其他 jQuery 脚本，并确保您始终封装每个 jQuery 脚本，如下所示。

确保每个使用 $ 作为快捷方式的 jQuery 脚本都像这样封装：

jQuery(function($) {

    //your code using jQuery in $ notation

    $(document).ready(function() {
        //code that needs to wait for complete load of DOM
    });
});

我在stackoverflow上的第一个答案，希望我能帮上忙。