Heim >Web-Frontend >HTML-Tutorial >Eine Fehlerbehebung für das optGroup-Tag im HTML-Dropdown-Feld
Eine Fehlerbehebung für das optGroup-Tag im HTML-Dropdown-Feld
- 黄舟Original
- 2017-07-03 09:57:542428Durchsuche
Wenn das erste Element im Dropdown-Feld optGroup ist und Sie mit dem Mausrad schnell nach oben scrollen, wird das erste Element optGroup ausgewählt. Dies ist nicht das gewünschte Ergebnis , und Wenn Sie Code verwenden, um den Wert des Dropdown-Felds abzurufen, tritt ein Fehler auf.
Nachdem optGroup ausgewählt wurde, ist der Wert von selectIndex immer noch 0, nachdem das Dropdown-Feld den Fokus verliert (wenn Optionen im Dropdown-Feld vorhanden sind). Der Wert von selectIndex ist nur wahr, wenn das Dropdown-Feld vorhanden ist. Das Down-Feld erhält wieder den Fokus und verliert den Fokus. Daher funktioniert die einfache Beurteilung des selectIndex in onblur nicht. Daher müssen wir einen Zwischenprozess durchführen und dann den selectIndex beurteilen, wenn die optGroup ausgewählt ist , setzen Sie den selectIndex auf 0.
Wenn das Dropdown-Feld nur optGroup enthält, ist standardmäßig kein Element ausgewählt, d. h. ein leeres Element. Der selectIndex eines leeren Elements ist also ebenfalls -1 In diesem Fall können Sie den selectIndex nicht direkt auf 0 setzen (da es kein Optionselement gibt). Ich kann ihn nicht auf -1 setzen, das hat keine Auswirkung. Wir müssen zuerst eine Option zum Dropdown-Feld hinzufügen. Setzen Sie den SelectIndex auf 0, dann den SelectIndex auf -1 und dann die neu hinzugefügte Option Löschen , da optGroup im Prinzip nicht ausgewählt werden kann. Wenn SelectIndex also auf -1 gesetzt ist, wird ein leeres Element angezeigt ausgewählt werden.
Der spezifische Code lautet wie folgt:
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<BODY>
<SELECT id="sel" onblur="ValidateElement(this);">
<optgroup label='1111'>
</optgroup>
</SELECT>
<SELECT id="sel1" onblur="ValidateElement(this);">
<optgroup label='1111'>
<option >12</option >
<option >23</option >
<option >34</option >
</optgroup>
<option >aa</option >
<option >bb</option >
<option >cc</option >
</SELECT>
</BODY>
</HTML>
<SCRIPT LANGUAGE="JavaScript">
<!--
function ValidateElement(obj)
{
var t = obj.selectedIndex;
obj.selectedIndex = -1;
obj.selectedIndex = t;
if(obj.selectedIndex == -1)
{
if(obj.options.length > 0)
{
obj.selectedIndex = -1;
obj.selectedIndex = 0;
}
else
{
opt = document.createElement("option");
opt.innerText = "";
obj.insertAdjacentElement("beforeEnd",opt);
obj.selectedIndex = 0;
obj.selectedIndex = -1;
try
{
obj.options[0] = null;
}
catch(e){}
}
}
}
//-->
</SCRIPT>
Das obige ist der detaillierte Inhalt vonEine Fehlerbehebung für das optGroup-Tag im HTML-Dropdown-Feld. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!