让form的action属性只提交数据不跳转页面
<form action="http://localhost:8080" method="post" enctype="multipart/form-data" accept-charset="utf-8" id="myForm" target="nm_iframe">
<input type="file" name="file" id="file" />
<input type="submit" id="mySub" />
</form>
<iframe id="id_iframe" name="nm_iframe" style="display:none;"></iframe>
jsp中新窗口form提交时不打开新窗口并关闭当前窗口
----------------------------------不打开新窗口的方法---------------------------------------
其实很简单,加上以下代码:
<script type="text/javascript">
window.name = "curWindow";
</script>
对应的form添加target:
<form name="myForm" id="myForm" action="" method="post" target="curWindow">
----------------------------------提交form关闭当前窗口--------------------------------------
示例:
<form action='#' id="myForm">
<input type="text" name="username" value=""/>
<input type="button" value="提交" οnclick="subform();"/>
</form>
方法:
function subform(){
var form = document.getElementById('myForm');//获取表单dom
form.action="testurl";//重新设置提交url
form.submit();//提交表单
window.close();//关闭窗口
}
————————————————
原文链接:https://blog.csdn.net/justdoit_potato/article/details/50426347
css定位&锚点
命名锚点链接(锚点):控制在同一个页面中进行跳转
1.跳转到的地方:<div id="box"></div>
2.点击按钮:<a href="#box">点击回到顶部</a>
3.注意
- 锚点只能用a标签控制
- 跳转的地方只能用id
4.作用:回到顶部、楼层效果、轮播图
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="../../03-reset.css">
<style>
html,body{
width: 100%;
height: 100%;
scroll-behavior: smooth
}
.btnBox{
width: 50px;
height: 250px;
background: #000;
position: fixed;
right: 0;
top: 35%;
}
/* 特殊情况 不会继承字体颜色 */
.btnBox a{
color: #fff;
display: block;
width: 50px;
height: 50px;
text-align: center;
line-height: 50px;
}
/* 宽高自适应:浏览器默认宽度是100% 高度是0 */
#box1,#box2,#box3,#box4,#box5{
width: 100%;
height: 100%;
}
#box1{
background: gray
}
#box2{
background: skyblue
}
#box3{
background: greenyellow
}
#box4{
background: yellowgreen
}
#box5{
background: peru
}
</style>
</head>
<body>
<div class="btnBox">
<a href="#box1">1F</a>
<a href="#box2">2F</a>
<a href="#box3">3F</a>
<a href="#box4">4F</a>
<a href="#box5">5F</a>
</div>
————————————————
版权声明:本文为CSDN博主「ZJH_are」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/ZJH_are/article/details/125773630
绝对定位属性的使用
1.属性:position
2.属性值:absolute
3.绝对定位属性的特点
- 绝对定位的参照物(父相子绝)
- 当父级元素有定位属性的时候就会相对于父级元素进行移动
- 当父级元素没有定位属性的时候,就会往上级查找,直至找到浏览器
- 绝对定位会脱离文档流,破坏了正常的网页布局
拓展布局中"流"的概念
1.普通流:文档流、文档层 表示网页的正常布局
2.浮动流:浮动层 浮动在网页的上方
3.定位流:定位层 在浮动层的上面
4.定位>浮动>文档
html表格表单-居中-循环
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<title>客户表</title>
<style>
body{}
div{margin:auto 5%;}
.parent {
display:flex;
justify-content:center;
align-items:center;
#div居中
}
table{margin:auto; width: 80%; max-width:1200px; #表格居中}
td{}
h1,h2,h3,h4,h5{text-align:center;}
</style>
</head>
<body>
<div class="parent">
<div>
<p>
每个表格从一个 table 标签开始。
每个表格行从 tr 标签开始。
每个表格的数据从 td 标签开始。
</p>
<h4>一列:</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
<h4>一行三列:</h4>
<table border="1">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
</table>
<h4>两行三列:</h4>
<table border="1">
<tr >
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
<h1>客户跟进表</h1>
<table border="1">
<tr style="text-align: center; font-weight: bold;">
<td style="width:26px;">序号</td>
<td style="width:26px;">姓名</td>
<td>电话</td>
<td>客户信息</td>
<td>跟进情况</td>
<td>备注</td>
</tr>
<?php
for ($i=1; $i<=5; $i++)
{
//echo "数字为 " . $i . PHP_EOL;
echo
'
<tr>
<td style="text-align: center; font-weight:bold;">'.$i.'</td>
<td style="text-align:center;">x先生</td>
<td>133xxxxx968</td>
<td style="text-indent: 5px; ">X先生 133xxxxx968 后海</td>
<td style="text-indent: 5px;">X天上门量房</td>
<td style="text-indent: 5px;">有效</td>
</tr>
<tr>
<td colspan="2" style="text-align: center;">更新</td>
<td colspan="3"><textarea cols="40" placeholder="请输入 序号'.$i.' X先生跟进的情况结果..." style="text-indent: 20px; max-width:100%;"></textarea></td>
<td><input type="submit" value="提交"></td>
</tr>
';
}
?>
</table>
</div>
</div>
</body>
</html>