Ich habe den folgenden Code, der zum Ändern von 2 Dropdown-Menüs auf Seite beginnt und bei der Auswahl dient. Das erste enthält Hauptkategorien, die sich für die Seitenkategorie anpassen sollten, die beim Laden der Seite eins ist. Die zweite Option bietet dann verschiedene Optionen, je nachdem, was in der ersten Option ausgewählt ist (entweder durch Seitenstart oder durch Auswahl).Änderung Dropdown funktioniert nicht wie erwartet in Firefox
Der folgende Code funktioniert perfekt in großen modernen Browsern aber NICHT wie in Firefox angenommen.
Das Problem, dass in der ersten Dropdown meine pageCat Option, ja, bewegt sich nach oben, aber dennoch in Firefox der alte Text im sichtbaren Feld gehalten wird. Habe ich hier semantische Probleme?
jQuery(document).ready(function(){
// get the page category
var pageCat = jQuery("#page-wrapper .breadcrumb").find("li.active").text().replace(/\s+/g, '-').toLowerCase();
// get inserted post category instead in case of single seminar
if (jQuery(".courses-detail").length) {
jQuery('.courses-detail').each(function() {
$courseCat = this.className.match(/(^|\s)sw_course_cat\S+(\s|$)/);
});
pageCat = $courseCat[0].replace('sw_course_cat-','').trim();
};
// store drop down menus
var $dropDown = jQuery('#page-wrapper select[name="courses[category]"]');
var $dropDown_2 = jQuery('#page-wrapper select[name="courses[location]"]');
// make it the first in the drop down list
// remove “all categories” option
var $standard = $dropDown.find('option[data-link="http://www.falkenberg-seminare.de/cms/edu-course/"]');
$standard.remove();
// change position
var $startList = $dropDown.find('option[value="' + pageCat + '"]');
$startList
.remove();
$dropDown.prepend($startList);
// filter the second drop down based on first drop down option selected
var $options = $dropDown_2.clone(); // this will save all initial options in the second dropdown
$dropDown.change(function() {
var filters = [];
if (jQuery(this).val() == "") {
jQuery(this).find("option").each(function(index, option) {
if (jQuery(option).val() != "")
filters.push(jQuery(option).val());
});
} else {
filters.push(jQuery(this).val())
}
$dropDown_2.html("");
jQuery.each(filters, function(index, value) {
$options.find("option").each(function(optionIndex, option) { // a second loop that check if the option value starts with the filter value
if (jQuery(option).val().startsWith(value))
jQuery(option).clone().appendTo($dropDown_2);
});
});
});
$dropDown.trigger('change');
});
Es tut mir leid ein Fiddle nicht zu liefern, aber ich kann nicht vorstellen, wie die pageCat Auswahl emulieren korrekt auf Seite laden zu demonstrieren. Aber vielleicht gibt es ein bekanntes Firefox-Code-Problem, von dem ich nichts weiß (und Google hat nicht geholfen).
Vielen Dank für jede Hilfe!