javascript

bookmarklet

test <select>

<span>
   <select id=sel
   onchange="
   // when selecting first item, on first load,
   // * not called in fox 1.5 (both win32 and linux)
   // * called in ie6, fox 1.0, fox 2.0
   alert(this.value);
   ">
      <option>a</option><option>a</option>
      <option>aa</option><option>aaa</option>
      <option value=value label=label></option>
      <option value=value label=label>text</option>
   </select>
   <button onclick="
      for (; sel.length > 0; ) sel.removeChild(sel.lastChild);
      sel.selectedIndex = -1;
      sel.appendChild(document.createElement('option'));
      sel.lastChild.appendChild(document.createTextNode('new'));
      sel.selectedIndex = -1; // this is reset to 0 in both fox and ie6, when new option is added after this
      sel.appendChild(document.createElement('option'));
      sel.lastChild.appendChild(document.createTextNode('new'));
      sel.appendChild(document.createElement('option'));
      sel.lastChild.appendChild(document.createTextNode('new'));
      sel.appendChild(document.createElement('option'));
      sel.lastChild.appendChild(document.createTextNode('new'));
      sel.lastChild.value = 'new';
      sel.value = 'val'; // same as selectedIndex=-1 in ie6
      sel.value = 'new';
      sel.parentNode.insertBefore(sel, sel);
      sel.parentNode.insertBefore(sel, null);
      sel.selectedIndex = -1; // work in fox and ie6
      alert(sel.selectedIndex); // result is -1
      // moving node after selectedIndex, will make selectedIndex reset in ie6
      sel.parentNode.insertBefore(sel, sel);
      alert(sel.selectedIndex); // ie6: result is 0
      sel.selectedIndex = -1; alert(sel.selectedIndex);
      sel.parentNode.insertBefore(sel, null);
      alert(sel.selectedIndex); // ie6: result is 0
      sel.selectedIndex = 2; alert(sel.selectedIndex);
      sel.parentNode.insertBefore(sel, sel);
      alert(sel.selectedIndex); // ie6: result is 2
      sel.selectedIndex = 2; alert(sel.selectedIndex);
      sel.parentNode.insertBefore(sel, null);
      alert(sel.selectedIndex); // ie6: result is 2
   ">
</span>

<script language="JavaScript" type="text/javascript"><!--
// work in ie6
var sel = document.getElementById('sel');
sel.selectedIndex = -1;

//--></script>