Summary of the use of forms in JS

  • 2020-03-30 01:20:18
  • OfStack

1. Javascript method to refresh the page
Window. The location. Reload ();

Refresh the parent window with the popup window that pops up using
      Window. Opener. Location. Reload ()

Use the mode window that pops up in window.showdialog
      Window. DialogArguments. Location. Reload ();

2. Two ways to implement javascript pop-up Windows -- here are two examples of pop-up screen centered Windows
Window. The open () method

       function ShowDialog(url) { 
           var iWidth=300; //Window width
           var iHeight=200;//Window height
           var iTop=(window.screen.height-iHeight)/2;
           var iLeft=(window.screen.width-iWidth)/2;
     Width="+iWidth+" ,Height="+iHeight+",top="+iTop+",left="+iLeft); 

Window. ShowModalDialog way

     function ShowDialog(url) { 
           var iWidth=300; //Window width
           var iHeight=200;//Window height
           var iTop=(window.screen.height-iHeight)/2;
           var iLeft=(window.screen.width-iWidth)/2;
           window.showModalDialog(url,window,"dialogHeight: "+iHeight+"px; dialogWidth: "+iWidth+"px;
     dialogTop: "+iTop+"; dialogLeft: "+iLeft+"; resizable: no; status: no;scroll:no");

Notice the second parameter here, window

3. Set the method of not caching data in the page

Add the following statement   to the JSP page;

      response.setDateHeader("Expires", 0);

4. Ways to close a page without prompting

function CloseWin(){ 
    var ua = navigator.userAgent; var ie = navigator.appName=="Microsoft Internet Explorer"?true:false; 
 var IEversion = parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE ")))); 
    if( IEversion< 5.5){
    var str = '';
    document.body.insertAdjacentHTML("beforeEnd", str);
   } else {
      window.opener =null; window.close();

5, regularly close the pop-up window -- set/clear the timer

setTimeout("self.close()",100000)//This is in milliseconds. This is 100 seconds

6. Javascript pop-up child window to pass the value -- through the url to pass the value

<script language="javascript" type="text/javascript">
function fn_modify(pid){
    var ModifyInfo=new Object();
function Reload(){location.href="abc.asp";}
<a href="abc.asp" onClick="fn_modify(' This is the value ')"> Click on the </a>

7. Js hide/show form
Document. All (" id "). Style. The display = = "none"; / / hide
Document. All (" id "). Style. The display = = ""; / / show
Document. The getElementById (" bt ") style. The display = = "none"
Document. The getElementById (" bt ") style. The display = = ""
Id is the table, the id of the input

8. Js controls the form element to be valid/invalid
Document. The getElementById (" bt "). The disabled = true;
Document. All (" Submit1 "). The disabled = true; / / failure
Document. All (" Submit1 "). The disabled = false; / / effective

Sets/gets the value of the element
Document. GetElementById (" labTitle "). The innerHTML = "IP mode"; / / set the value
Document. The getElementById (" labTitle "). The innerHTML / / get the value
LabTitle is div, span, id of table

Example 1:

<input id="mytext" type="text" value=" I can't use it ">
<input type="button" value="disabled" onClick="javascript: document.all.mytext.disabled='false'">
<input type="button" value="enable" onClick="javascript: document.all.mytext.removeAttribute('disabled')">

Example 2:

 <input id="mytext" type="text" value=" I can use it ">
<input type="button" value="disable" onClick="if (mytext.disabled==false){ mytext.disabled=true;mytext.value=' I can't use it ';this.value='enable'} else { mytext.disabled=false;mytext.value=' I can use it ';this.value='disable'}"> 

9. The method of page submitting form through function

function exit(){

10. Iterate over the radio method

<input id="mode1" type="radio"    name="workMode" value="1" checked>
var radios=document.getElementsByName("workMode");
 var workMode="";
     for(var i=0;i<radios.length;i++){

Add options dynamically to select

<select id="ddlProvince" name="ddlProvince" onchange="cityResult()">
var prov=document.getElementById("ddlProvince");
        prov.options.add(new Option("--- Please select a ---",""));
    var pArray=zoneIdProvince.split("&");
    for(var i=0;i<pArray.length;i++){
      var idpArray=pArray[i].split("#");
      var sZoneID=idpArray[0];
      var sProvince=idpArray[1];
      prov.options.add(new Option(sProvince,sZoneID));

12. How to use prototype ajax to submit data in the page (Java)

Step: in < Head> < / head> Add the following link to the js file

<script language="JavaScript" src="/NDHotel/js/prototype-1.6.js"></script>

Step 2: place the prototype-1.6.js file in the directory specified by /NDHotel/js/

Three steps: in < The script type = "text/javascript" > < / script> The following call function is declared in

<script type="text/javascript">
function editIpSegment(){
 var url='/NDHotel/';
 var pars = 'startip='+startip+'&endip='+endip+'&lindex='+lindex;

new Ajax.Request( url, {method: 'get', parameters: pars, asynchronous:false,onComplete:editResult});
function editResult(result){
    var returnStr = result.responseText;
    if(returnStr =='fail'){
      return false;  

Step 4: implement the background call

 public ActionForward roomChangeNotice(ActionMapping mapping,
   ActionForm form, HttpServletRequest request,
   HttpServletResponse response) throws Exception {
  String result = "";
  PrintWriter pw = RainPrintWriter.getPrintWriter(response);
  try {
   NotifyServiceTwo.sendMessage(4, 0);
   result = "success";
  } catch (Exception e) {
   logger.error("roomChangeNotice" + e);
  return null;

13. How to get the value of the form in js:
document.all.lindex.value//Lindex must be unique in the page
//Set to get focus
//Set to lose focus

14. Dynamically add/remove rows from a table

<table width="100%"  id="tdSearch" name="tdSearch" cellpadding="0" cellspacing="0" align="center">
//Dynamically generate the rows of the table
var autoId = 0; //Self-incrementing variable & NBSP;
function addRow(value1,value2){       
 var highQuery=document.getElementById("tdSearch"); 
 var newRow = highQuery.rows[highQuery.rows.length - 1]; = "row_" + autoId; 
 newRow.cells[0].innerHTML = "<input width='200' value='"+value1+"' onchange='changeip("+autoId+")' type='text' id='bIPFrom_"+autoId+"'>-";

 newRow.cells[1].innerHTML = "<input width='200' value='"+value2+"' type='text' id='bIPTo_"+autoId+"'> ";      

   var cell2 = newRow.insertCell(); 
 cell2.innerHTML = "<input  class='btn_1word' type='button' class='HQ_BUTTON' value='-' onClick=removeRow('" + + "')>";
       cell2.setAttribute("class", "yellowCell2"); 
function removeRow(rowId){
 var trRow = document.getElementById(rowId);

Collection of 15.

//Displays the import progress bar
document.all("DataGrid_WaitDiv").style.display = "";
16. Create a new window 
function layer1AddGroup() {
var url='/NDHotel/jsp/systemset/roomSet/addGroup.jsp';
var newwin=window.showModalDialog(url,window,"dialogWidth=470px;dialogHeight=400px;scroll=yes;status=no;help=no;");
//Refresh the parent page
function roomMainLeftRightFrame(){
var layer='<%=layer%>';

17. Set the read-only property of the text box/set the color of the text box/set the radio selection


//IP address verification
function ipCheck(ipValue){
 var reg = /^/d{1,3}(/./d{1,3}){3}$/;
 if(ipValue != ""){
  if (reg.test(ipValue)){
   var ary = ipValue.split('.');
   for(key in ary){
    if (parseInt(ary[key]) > 255 )
     return false;
   return true;
 return false; 
 return true; 

Related articles: