Safari에서 작동하지 않는 동적으로 업데이트 된 옵션이 여러 개 선택 - iphone

Question

"City"선택 상자에서 도시를 선택할 수있는 코드를 작성한 후 두 번째 선택 상자 "Area"가 필터링되고 표시됩니다 그 도시 내의 구역들, 그래서 사용자는 한 도시 내의 여러 구역을 선택할 수 있습니다. 선택 상자 "영역"은 다중 선택을 허용합니다. 그래서이 코드는 파이어 폭스, 크롬에서 작동하지만 모든 도시의 모든 영역이 표시됩니다 아이폰 (사파리) (필터링되지 않음) 여부에 :

$('#property_city_submit9').change(function(){ 

    var city = $(this).val(); 
    if(city !== 'all'){ 

    $('#property_area_submit9 option:selected').removeAttr("selected"); 
    $('#property_area_submit9 option').css('display', 'none'); 
    $('#property_area_submit9 option[data-parentcity="'+city+'"]').css('display', 'block'); 

    }else { 

    $('#property_area_submit9 option:selected').removeAttr("selected"); 
    $('#property_area_submit9 option').css('display', 'none'); 
    $('#property_area_submit9 option[value="all"]').css('display', 'block'); 
    } 
});  

• property_city_submit9 - "시는"상자를 선택
• property_area_submit9 - " 영역 선택 "상자 (다중 선택)의 경우 해당 옵션의 속성은 data-parentcity - 영역이 속한 도시의 이름입니다.

이해가되지 않습니다. css() 방법이 Safari에서 작동하지 않습니까? 모든 도움을 감사하십시오.

Answer 1

이봐, 내 문제에 대한 해결책을 찾은 것 같아. 이 기사에 이어 https://stackoverflow.com/a/15025961/6822695, iphone으로 css 메서드로 재생할 가능성이 없으므로 append() 및 remove()를 사용하여 코드를 변경했습니다. 코드는 다음과 같습니다.

$('#property_city_submit9').change(function(){ 

    var city = $(this).val(); 
    $('#property_area_submit9 option:selected').removeAttr("selected"); 
    $('#property_area_submit9').find('option').remove(); 
    var addopti ='<option data-parentcity="*" value="all"></option>'; 

    if(city !== 'all'){ 


    $('.area_stock_info li').each(function(){   

    if($(this).attr('data-city') == city){ 

     addopti +='<option value="'+$(this).attr('data-value')+'" data-parentcity="'+$(this).attr('data-city')+'">'+$(this).attr('data-value')+'</option>'; 

    }  
    }); 

    $('#property_area_submit9').append(addopti); 

    }});