SoFunction
Updated on 2025-02-28

JavaScript operation select element instance analysis

This article describes the usage of JavaScript operation select elements. Share it for your reference. The specific analysis is as follows:

Here I am familiar with js' operation on select elements. Create a form in the html page, which contains a select element and submit button.

When an item in select is selected, it changes its text, and when all items in select are changed, they are restored again.

When submit is pressed, the window itself is closed, the code is as follows:

<!DOCTYPE html>
<html>
<head>
<title>duang for select elements</title>
<script type="text/javascript">
 function do_change(elt){
  var text = elt[].innerHTML;
  if(!(/\[/))
   elt[].innerHTML += " [duang]";
  var is_all_seleted = true;
  for(var i=0;i<;++i){
   if(!elt[i].(/\[/)){
    is_all_seleted = false;
    break;
   }
  }
  if(is_all_seleted){
   alert("all duang!!!\nand reset it!!!");
   for(var i=0;i<;++i){
    elt[i].innerHTML = elt[i].(/\s\[.*\]/,"")
   }
  }
 }
</script>
</head>
<body>
 <form  action="#" method="post">
  <select  onchange="do_change(this);">
   <option value="opt_1">opt A</option>
   <option value="opt_2">opt B</option>
   <option value="opt_3">opt C</option>
   <option value="opt_4">opt D</option>
   <option value="opt_5">opt E</option>
  </select>
  <input type="submit" value="close window" onclick="();"/>
 </form>
</body>
</html>

In firefox, it seems that the window itself cannot be closed at first, but later it is found that in about:config, it is enough to set dom.allow_scripts_to_close_windows to true.

If the options in each select change are not regular, you can write an on_change_ex to handle it, the code is as follows:

function do_change_ex(me){
  var text = me[].innerHTML;
  if(!(/\[/)){
   me[].text_bak = me[].innerHTML;
   me[].innerHTML += " [duang]";
   me[].is_changed = true;
  }
  var is_all_seleted = true;
  for(var i=0;i<;++i){
   if(!me[i].is_changed){
    is_all_seleted = false;
    break;
   }
  }
  if(is_all_seleted){
   alert("all duang!!!\nand reset it!!!");
   for(var i=0;i<;++i){
    me[i].innerHTML = me[i].text_bak;
    me[i].is_changed = false;
   }
  }
}

I hope this article will be helpful to everyone's JavaScript programming.