Question

我有一个非常简单的例子：

<html> 
<head> 

 <title> Addition</title> 

<script type="text/javascript"> 

    document.write("Please enter values to be added into the fields and click Add button1");


function sum() 
{     
     var num1 = document.formOne; 
     value1 = Number(num1.input1.value); 

     var num2 = document.formOne; 
     value2 = Number(num2.input2.value);   

  if (value1=="")
    { 
       document.write("Valid value cannot be empty!"); 

    }
  else if(value2=="")
    { 
        document.write("Valid value cannot be empty!"); 

    }
    else 
    { 
       var add = value1 + value2;    
       document.write ("The sum is " + add );     
    } 

 return true;
}

</script> 
</head> 

<body> 

<form id="forma" name="formOne" runat="server" onsubmit="sum()">
    <p><input id="Textone" name="input1" type="text" size="8"></p> 
    <p><input id="Texttwo" name="input2" type="text" size="8"></p> 
    <p><input type="submit" value="Add"> </p> 
</body> 
</html>

在IE中添加＆＃39;单击答案，但页面不会在F5上重新加载。要重新加载，我需要回复＃39;在Chrome中，答案会闪烁，但页面会重新开始。我做错了什么？

Answer 1

如果您不希望表单完成将数据提交回服务器，则您的onsubmit参数应返回false。

function sum() 
{     
  var num1 = document.formOne; 
  value1 = Number(num1.input1.value); 

  var num2 = document.formOne; 
  value2 = Number(num2.input2.value);   

  if (value1=="")
  { 
    document.write("Valid value cannot be empty!"); 

  }
  else if(value2=="")
  { 
    document.write("Valid value cannot be empty!"); 

  }
  else 
  { 
    var add = value1 + value2;    
    document.write ("The sum is " + add );     
  } 


  return false; // Changed to "false"
}

您还需要调整HTML，以便sum()的值实际返回到onsubmit处理程序。

<form id="forma" name="formOne" runat="server" onsubmit="return sum();">

执行'submit'表单后，浏览器的行为会有所不同

1 个答案: