jQuery更改选择框选项文本-在iOS上不起作用

Question

在Magento电子商务网站上，具有不同价格的产品选项的当前默认行为是在Select下拉列表中具有价格差异，例如Blue +£2，Orange-£3。 客户在这里不想要这个。

我对Magento的流利程度不足，无法通过PHP代码进行更改，因此一直使用JQuery修改下拉菜单中的文本。 虽然这在我的Windows机器和Android手机上都有效，但似乎在iPhone和iPad上却不起作用。 （不确定Macbook等）。 价格在您第一次打开选择框时仍然存在，但在下一次消失了。 因此该代码确实有效，只是在打开之前没有。

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代替了焦点，现在似乎可以了。 谢谢

Answer 1

尝试使用纯JavaScript代码执行此操作。由于跨平台问题，使用jquery的某些功能可能无法实现。 在事件上使用JavaScript的方式与JQuery有所不同。 删除$（document）.ready，并确保您使用函数重新启动JQuery代码。

Answer 2

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