Magento -- 可配置产品的选项如何默认选中第一项

刺骨的言语ヽ痛彻心扉 2022-06-07 02:21 139阅读 0赞

If you ever tried to do anything with Magento configurable products view page, most likely you needed changes in /js/varien/product.js in case you wanted to manipulate dropdowns.  
This will be one of the ways to do it.  
Basically, what we need to do in order to make initial selection of a product is the following:  
Open this file: /app/design/frontend/default/your\_theme/template/catalog/product/view/type/options/configurable.phtml  
Right below

var spConfig = new Product.Config(< ?php echo $this->getJsonConfig() ?>);

add this JavaScript code:

//we create new function 
    spConfig.setInitialState = function(dropdown_id) {   
    //select dropdown 
    var dropdown = $(dropdown_id);  
    //remove empty option from dropdown so it is not selectable after initial selection 
    dropdown[0].remove();  
    //change selections in dropdowns 
    for(index = 0; index < dropdown.length; index++)  
    {  
    if(dropdown[index].value != "")  
    {  
    dropdown.selectedIndex = index;  
    var element = dropdown;  
    var event = 'change';  
    //fire events 
    if(document.createEventObject)  
    {  
    var evt = document.createEventObject();  
    return element.fireEvent('on'+event,evt)  
    }  
    else  
    {  
    var evt = document.createEvent("HTMLEvents");  
    evt.initEvent(event, true, true );  
    return !element.dispatchEvent(evt);  
    }  
    }  
    }  
    };  
    <?php foreach($_attributes as $_attribute): ?>  
    spConfig.setInitialState("attribute< ?php echo $_attribute->getAttributeId() ?>")  
    < ?php endforeach; ?>

That’s it. I hope you can find this usable, however don’t use it on production site without extensive testing.  
As you can see, all prototype functions in Magento (and in general) can be added as new into already existing class.  
Same way you could override existing methods in existing classes.  
I have coded this feature for the purpose of this article and I’m not claiming that it is production ready. It is only for informative purposes.