запускать js оповещений от es6 в iOS сафари не работает - PullRequest
2 голосов
/ 24 февраля 2020

У меня есть веб-сайт, который выдает предупреждение при добавлении товаров в корзину. Я использую javascript ES6, html5. Я динамически создаю карты в стиле bootstrap с элементами меню на странице и кнопкой добавления в корзину. при нажатии кнопки «Добавить в корзину» выдается предупреждение. Предупреждение пытается сработать на сафари iOS 13.xx, но не отображается. Я попытался установить тайм-аут, но это не сработало. Должно быть так, как его называют. Я действительно не знаю, что попробовать дальше. Я читал, что пользовательская навигация (назад, вперед) может прерывать оповещения. В 'addEventListener' в 'btn' в нижней части этого метода horrifi c возникает проблема. Почему это не работает на Safari Mobile?

createMenuCard(menu){
            var heading = document.getElementById("concession-name");
            heading.innerText = menu.menus.menu.concessionName;

            var card = null;
            var body = null;
            var lsgroup = null;

            for(var i = 0; i < menu.menus.menu.categories.length; i++){

                for(var j = 0; j < menu.menus.menu.categories[i].menuItems.length; j++){

                    this.card = document.createElement('div');
                    this.card.className = 'card';
                    this.card.setAttribute('id', this.uuidv4());
                    this.card.setAttribute('style', 'width: 20rem;');
                    this.body = document.createElement('div');
                    this.body.className = 'card-body';

                    var title = document.createElement('div');
                    title.className = 'card-title';
                    title.innerText = menu.menus.menu.categories[i].menuItems[j].name;
                    this.body.appendChild(title);
                    this.lsgroup = document.createElement('div');
                    this.lsgroup.className = "list-group";
                    this.body.appendChild(this.lsgroup);

                    for(var k = 0; k < menu.menus.menu.categories[i].menuItems[j].subItems.length; k++){


                        if(menu.menus.menu.categories[i].menuItems[j].subItems[k].name === "")
                        {
                            var id = this.uuidv4();

                            var input = document.createElement("input");
                            input.setAttribute("type", "checkbox");
                            input.setAttribute("name", "");
                            input.setAttribute("id", id);
                            input.setAttribute("value", menu.menus.menu.categories[i].menuItems[j].name);
                            input.setAttribute("price", menu.menus.menu.categories[i].menuItems[j].subItems[k].price);
                            this.lsgroup.appendChild(input);
                            // label
                            var label = document.createElement("label");
                            label.className = "list-group-item";
                            label.setAttribute("for", id);
                            label.innerText = menu.menus.menu.categories[i].menuItems[j].subItems[k].price + "  " + menu.menus.menu.categories[i].menuItems[j].name;
                            this.lsgroup.appendChild(label);
                        } 
                        else 
                        {
                            var id = this.uuidv4();
                            // input
                            var input = document.createElement("input");
                            input.setAttribute("type", "checkbox");
                            input.setAttribute("name", "");
                            input.setAttribute("id", id);
                            input.setAttribute("value", menu.menus.menu.categories[i].menuItems[j].subItems[k].name);
                            input.setAttribute("price", menu.menus.menu.categories[i].menuItems[j].subItems[k].price);
                            this.lsgroup.appendChild(input);
                            // label
                            var label = document.createElement("label");
                            label.className = "list-group-item";
                            label.setAttribute("for", id);
                            label.innerText = menu.menus.menu.categories[i].menuItems[j].subItems[k].price + "  " +menu.menus.menu.categories[i].menuItems[j].subItems[k].name;
                            this.lsgroup.appendChild(label);
                        }
                    }

                    var btn = document.createElement('a');
                    btn.setAttribute("href", "#"); // javascript:toCart()
                    btn.addEventListener("click", (e)=> {

                        var inputs = e.path[2].querySelector("div > div.list-group").getElementsByTagName("input");
                        var description = e.path[2].querySelector("div > div.card-title").innerText;

                        for(var l = 0; l < inputs.length; l++){
                            if(inputs[l].checked === true){

                                var obj = {
                                    option : inputs[l].value,
                                    price : inputs[l].getAttribute("price")
                                };

                                setTimeout(function(){
                                    window.alert("Added: " + description + " to cart");
                                }, 300);
                                //window.alert("Added: " + description + " to cart");
                                description += " " + obj.option;
                                var appItem = new AppItems(description, obj.price, 1);
                                cart.addItem(appItem); 
                            }
                        }
                    });

                    btn.className = "btn btn-primary";
                    btn.innerText = "Add To Cart";
                    this.body.appendChild(btn);
                    this.card.appendChild(this.body);
                    var container = document.getElementById('cards');
                    container.appendChild(this.card);
                }
            }


            var chk = document.getElementById("checkout");
            chk.addEventListener("click", (e)=> {

                cart.save();
                window.open("./cart.html","_self");
            });
       }
...