移动设备上 Javascript 的区别

问：

六个月前我在这里提出了这个问题：链接到上一个问题

我的 html 不同之处在于我删除了 onclick/onchange 事件，并且更改了 javascript 以创建事件侦听器：

//clear previous selections when changing radio button

var elementsFeesType = document.forms['fees-form'].elements['feesType'];

var serviceSelection = function(){
    var serviceType = document.getElementsByClassName('service-option-item');
    for (var i = 0; i < serviceType.length; i++) {
    serviceType[i].selected="";
    }
};

for (var i = 0; i < elementsFeesType.length; i++) {
    elementsFeesType[i].addEventListener('click', serviceSelection, false);
    elementsFeesType[i].addEventListener('change', serviceSelection, false);
}

//show the relevant option selected in the field at the bottom

var elementsServiceOptionItem = document.forms['fees-form'].querySelectorAll('.service-option-item');

var serviceSelected = function() {
    var serviceItem = elementsServiceOptionItem; // Avoid redundant DOM query
    for (var j = 0; j < serviceItem.length; j++) {
        if (serviceItem[j].selected) {
            var value = serviceItem[j].value;
            var service = serviceItem[j].text;
            var choice = document.getElementById('fees-service-selected-f');
            choice.value = value;
            choice.text = service;
        }
    }
};

for (var j = 0; j < elementsServiceOptionItem.length; j++) {
    // Use 'change' event listener if you only want to trigger on change
    elementsServiceOptionItem[j].addEventListener('click', serviceSelected, false);
    elementsServiceOptionItem[j].addEventListener('change', serviceSelected, false);
}

//toggle the sick note fields

var toggleSection = function(selectedItem) {
    var selectedOption = selectedItem.value;
    var expanded4a = document.querySelector(".expanded4a");
    var expanded4b = document.querySelector(".expanded4b");

    expanded4a.style.display = "none";
    expanded4b.style.display = "none";

    if (selectedOption === "Sick Note") {
        expanded4a.style.display = "grid";
        expanded4b.style.display = "none";
    } else if (selectedOption === "Fit Note") {
        expanded4a.style.display = "none";
        expanded4b.style.display = "grid";
    }
};

for (var k = 0; k < elementsServiceOptionItem.length; k++) {
    
    elementsServiceOptionItem[k].addEventListener('click', function(event) {
        toggleSection(event.target); // Pass the clicked element as an argument
    }, false);
    elementsServiceOptionItem[k].addEventListener('change', function(event) {
        toggleSection(event.target); // Pass the changed element as an argument
    }, false);
}

但是我仍然无法让它在手机上工作，并且正在撕掉我的头发。我认为这与选择/选项以及它们的处理方式或手机上的东西有关。我试过“点击”、“更改”、“触摸”......一切都无济于事。

我试图做的是在选择选项时触发一个事件（该事件是打开另一个包含更多字段的 div）。

在我完全重新设计表单以列出 16 个单选按钮之前，而不是 5 个单选按钮，每个单选按钮都包含相关选项，有人有建议吗？

如果可能的话，一个善良的人。