提交form表单不刷新页面案列

提交form表单不刷新页面其实很简单的,这里拿上传图片来举列,大家有什么其它的方法也欢迎留言告知与我

       <form action="" method="post" id="IMGFORM" enctype="multipart/form-data" target="upload">
                      <table>
                          <tr>
                             <td  width="20%"><input  type="file" name="hotelimg" id="hotelimg"/></td>
                             <td  align="left">
                                 <button type="submit" onclick="return MySubmit();"><span class="glyphicon glyphicon-open">上传图片</span>                       </button>
                                 <span id="IMGERROR" style="color:red;"></span>
                             </td>
                         </tr>
                     </table>
                  </form>

<!--这里写个内嵌框 name属性值标明为upload 和form 表单的target属性值一致后台处理后就会返回到指定的内嵌框来

内嵌框影藏就看不到页面页面刷新的效果了-->

<iframe src="uploadimg.html"  name="upload" style="disra:none"></iframe>

<script type="javascript/text">

 /*
用途:检查输入字符串是否为空或者全部都是空格
输入:str
返回:
如果全是空返回true,否则返回false
*/
function isNull(str) {
if (str == "") return true;
var regu = "^[ ]+$";
var re = new RegExp(regu);
return re.test(str);
}

function MySubmit(){

  if(isNull($("#hotelimg").val())){

  $("#IMGERROR").html("请选择上传的文件");

  return false;

  }

  $("#IMGFORM").submit();

}

</script>

原文地址:https://www.cnblogs.com/laotan/p/3885465.html