BOGUE : Internet Explorer ne parvient pas à définir la propriété innerHTML de l'objet SELECT

Traductions disponibles Traductions disponibles
Numéro d'article: 276228
Agrandir tout | Réduire tout

Sommaire

Symptômes

Lorsque vous définissez la propriété innerHTML de l'objet SELECT, les modifications ne prendront effet correctement.

Résolution

Si vous devez utiliser les propriétés innerHTML, une solution de contournement consiste à utiliser un objet Div pour encapsuler l'élément SELECT, puis définissez la propriété innerHTML de l'objet Div . Par exemple :
<html>
<head>
<title>My Example</title>
<script language="Javascript">
var origDivHTML;

function init()
{
   origDivHTML = myDiv.innerHTML;
}

function setValues() 
{
   var oldinnerHTML = "your original innerHTML: " + yourDiv.innerHTML ; 	
   alert(oldinnerHTML);
   yourDiv.innerHTML = origDivHTML;
	 
   var curinnerHTML = "your current innerHTML: " + yourDiv.innerHTML ; 
   alert(curinnerHTML); 
}
</script>
</head>

<body onload="init()">

<div id="myDiv">
  <select name="firstSelect" size="1" >
    <option>11111</option>
    <option>22222</option>
    <option>33333</option>
  </select>
</div>

<div id="yourDiv">
  <select name="secondSelect" size="1" >
    <option>aaaa</option>
    <option>bbbb</option>
    <option>cccc</option>
  </select>
</div>
<button onclick = "setValues();">click me to set the values</button>
</body>
</html>
				

Dans l'idéal, vous devez utiliser la collection d'options pour ajouter les options d'un élément SELECT. Le code suivant illustre trois façons d'ajouter par programme les options à l'élément SELECT :
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>

<script>

function fill_select1() {

	for(var i=0; i < 100; i++) {
			select1.options[i] = new Option(i,i);
		}
}

function fill_select2() {

		var sOpts = "<SELECT>";
		for (var i=0;i<100;i++)
		{
			sOpts += '<OPTION VALUE="' + i + '">' + i + '</OPTION>\n';
		}
	
		select2.outerHTML = sOpts  + "</SELECT>";
}

function fill_select3() {

	for(var i=0; i < 100; i++) {
		   var oOption = document.createElement("OPTION");
		   oOption.text="Option:  " + i;
		   oOption.value=i;
		   document.all.select3.add(oOption)
		}
}



</script>

<H2>SELECT Box Population</H2>

<SELECT id=select1 name=select1></SELECT>
<INPUT type="button" value="Populate with options list" id=button1 
name=button1 onclick="fill_select1();"><BR><BR>
<SELECT id=select2 name=select2></SELECT> 
<INPUT type="button" value="Populate with outerHTML" id=button2 
name=button2 onclick="fill_select2();"><BR><BR>
<SELECT id=select3 name=select3></SELECT>
<INPUT type="button" value="Populate with using createElement" id=button3 
name=button3 onclick="fill_select3();">

</BODY>
</HTML>
				

Statut

Microsoft a confirmé qu'il s'agit d'un bogue dans les produits Microsoft répertoriés au début de cet article.

Plus d'informations

Procédure pour reproduire le comportement

L'exemple de code suivant illustre ce problème :
<html>
<head>
<script language="JavaScript">  
function test()
{
    var objSelect = document.all.idSelect;
    var strOrigHTML     = objSelect.innerHTML;
    objSelect.innerHTML = strOrigHTML;
    var strNewHTML      = objSelect.innerHTML;

    if (strNewHTML == strOrigHTML)
        alert("Test passed.");
    else
        alert("Test failed: innerHTML = " + strNewHTML );
}
</script>
</head>
<body>
  <select id="idSelect">
    <option value="line1">Option 1</option>
    <option value="line2">Option 2</option>
  </select>
  <input type="button" value="test" onClick="test()" />
</body>
</html>
				

Références

Pour plus d'informations sur la sélection d'un objet, consultez l'article suivant sur le réseau MSDN (Microsoft Developer) :
Select-Object
Pour plus d'informations sur la collection d'options , consultez l'article suivant sur le site MSDN :
Collection d'options

Propriétés

Numéro d'article: 276228 - Dernière mise à jour: mardi 3 septembre 2013 - Version: 3.0
Mots-clés : 
kbbug kbdhtml kbnofix kbmt KB276228 KbMtfr
Traduction automatique
IMPORTANT : Cet article est issu d'une traduction automatique réalisée par un logiciel Microsoft et non par un traducteur professionnel. Cette traduction automatique a pu aussi être révisée par la communauté Microsoft grâce à la technologie Community Translation Framework (CTF). Pour en savoir plus sur cette technologie, veuillez consulter la page http://support.microsoft.com/gp/machine-translation-corrections/fr. Microsoft vous propose en effet des articles traduits par des professionnels, des articles issus de traductions automatiques et des articles issus de traductions automatiques révisées par la communauté Microsoft, de manière à ce que vous ayez accès à tous les articles de notre Base de connaissances dans votre langue. Il est important de noter que les articles issus de la traduction automatique, y compris ceux révisés par la communauté Microsoft, peuvent contenir des erreurs de vocabulaire, de syntaxe ou de grammaire. Microsoft ne pourra être tenu responsable des imprécisions, erreurs, ainsi que de tout dommage résultant d?une traduction incorrecte du contenu ou de son utilisation par les clients.
La version anglaise de cet article est la suivante: 276228
L'INFORMATION CONTENUE DANS CE DOCUMENT EST FOURNIE PAR MICROSOFT SANS GARANTIE D'AUCUNE SORTE, EXPLICITE OU IMPLICITE. L'UTILISATEUR ASSUME LE RISQUE DE L'UTILISATION DU CONTENU DE CE DOCUMENT. CE DOCUMENT NE PEUT ETRE REVENDU OU CEDE EN ECHANGE D'UN QUELCONQUE PROFIT.
Exclusion de responsabilité concernant les contenus obsolètes dans la Base de connaissances
Cet article concerne des produits pour lesquels Microsoft n'offre plus de support. Il est par conséquent fourni « en l'état » et ne sera plus mis à jour.

Envoyer des commentaires

 

Contact us for more help

Contact us for more help
Connect with Answer Desk for expert help.
Get more support from smallbusiness.support.microsoft.com