Question

我有一个包含多个标签的订阅表单。您可以在此表单中单击向后和向前。

对于下拉菜单，我使用jquery来预选前一个选项，这样人们就不必在向后点击时重新回答这个特定问题。

此脚本适用于Chrome和Firefox，但对于Safari，它根本不起作用。不知何故，我无法让它发挥作用。

请你看看它，告诉我我做错了什么？

脚本：

if (repeat_visit !== '') {
    $('#repeatVisit').find('option').each(function(){
        if ($(this).val() === repeat_visit) {
            $(this).attr('selected','selected');
        }
    });
}

该属性设置为选项，如下所示：是

我可以看到确实发生了这种情况，但似乎Safari在页面加载后添加所选属性时不会更改页面。所以我需要触发这个改变事件。

Answer 1

我找到了答案！

您可以使用.prop（'selected'，true）代替attr（'selected'，'selected'）;

Answer 2

我只是使用.prepend()函数更改DOM元素，以将选择的选项添加到select内的第一个元素。

selectElement.children[i].setAttribute("selected", true);
selectElement.prepend(selectElement.children[i]);

Answer 3

截至撰写本文时，以下功能适用于当前的 Safari、Safari Mobile、Chrome、Edge 和 Firefox。

这处理了 .prop 调用必须在 .attr 调用之前完成或整个事情被忽略的问题，以及 firefox 中的重绘问题。

    function updateSelect(selectname, value){
        $('select[name="'+selectname+'"] option').prop('selected',false);
        $('select[name="'+selectname+'"] option').removeAttr('selected');
        $('select[name="'+selectname+'"] option[value="'+value+'"]').prop('selected',true);
        $('select[name="'+selectname+'"] option[value="'+value+'"]').attr('selected','selected');
        $('select[name="'+selectname+'"]').val(value).change();
    }

选择的jQuery下拉列表=在Safari中选择不起作用

3 个答案: