首页 > 解决方案 > Jquery 更改选择框选项文本 - 在 iOS 上不起作用

问题描述

在 Magento 电子商务网站上,具有不同价格的产品选项的当前默认行为是在“选择”下拉菜单中显示价格差异,例如,蓝色 + 2 英镑,橙色 - 3 英镑。客户不希望这里出现。

我在 Magento 中不够流利,无法通过 PHP 代码进行更改,因此使用 JQuery 修改下拉列表中的文本。虽然这适用于我的 Windows 机器和 Android 手机,但它似乎不适用于 iPhone 和 iPad。(不确定Macbooks等)。价格在您第一次打开选择框时仍然存在,但下一次就消失了。所以代码确实有效,只是在打开之前没有。

require(["jquery"], function($) {
    $(document).ready(function() {
        // $('select.super-attribute-select').focus(function(){
            $('select.super-attribute-select').on('focus', function(){

            $('option').each(function(){
                var selectedOption = $(this).text();

                if (selectedOption.indexOf('+') > -1) {
                    selectedOption = selectedOption.substring(0, selectedOption.indexOf('+'));
                    $(this).text(selectedOption);
                } else if (selectedOption.indexOf('-') > -1) {
                    selectedOption = selectedOption.substring(0, selectedOption.indexOf('-'));
                    $(this).text(selectedOption);
                }
            });     
        });

    });
});

最初我有 .focus 但也尝试过 .on('focus') 版本,但都不起作用。

如果我输入 $(".product-info-main .page-title-wrapper h1").css('color', '#485158'); 在document.ready之后,H1的颜色发生了变化,所以正在寻找代码。除了我应该使用的焦点之外还有其他东西可以让它与 iOS 一起使用吗?

回答 - 我最终改为 mousedown 而不是 focus,它现在似乎可以工作了。谢谢

标签: jqueryiosmagento

解决方案


将您的 Jquery 版本更新为 >= 3


推荐阅读