html 问题
1、footer处理
目标:
页面较短,footer位于页面底部,出现滚动条时,依然在原来的位置,不随滚动条移动
页面较长,位于元素底部
.container{
position: relative
}
.footer{
position: absolute;
bottom: 0
}
var w_h = window.screen.height;
var c_h = $('.container').height();
if(c_h > w_h){
$('.footer').css('position', 'static');
}else{
$('.container').css('height', $(document).innerHeight());
}
// 要使用$(document).innerHeight(),而不能用window.screen.Height
2、form enter
场景:form中有一个input,input添加了change事件,输入内容后,enter,页面刷新。想要的效果是,输入内容后,enter,触发change事件。
解决办法:在form中添加一个隐藏的input。
原因:浏览器默认的几个原则
如果表单里有一个type=”submit”的按钮,回车键生效。
如果表单里只有一个type=”text”的input,不管按钮是什么type,回车键生效。
如果按钮不是用input,而是用button,并且没有加type,IE下默认为type=button,FX默认为type=submit。
其他表单元素如textarea、select不影响,radio checkbox不影响触发规则,但本身在FX下会响应回车键,在IE下不响应。 type=”image”的input,效果等同于type=”submit”,不知道为什么会设计这样一种type,不推荐使用,应该用CSS添加背景图合适些。
3、html5 a href支持的内容:https://, ftp://, mailto:, file:, tel:。
4、行内元素一般会有4px的间距,设置font-size:0,可以消除这个间距。inline or inline-block 都会有这个问题。
5、给图片添加热点区域,example中有。坐标是相对于图片本身的。
6、html5 的 text, search, url, telephone, email 以及 password 有一个新属性pattern title可以写正则,来更好的验证
7、iphone自动识别长串数字转换为a标签类型,解决办法加meta标签 telephone=no
8、a标签 直接下载文件
<a href='../data/test.pdf' download="" target='_black'>下载</a>
9、form提交数据 未知错误
可能是因为没有加enctype='multipart/form-data'
【推荐】还在用 ECharts 开发大屏?试试这款永久免费的开源 BI 工具!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET制作智能桌面机器人:结合BotSharp智能体框架开发语音交互
· 软件产品开发中常见的10个问题及处理方法
· .NET 原生驾驭 AI 新基建实战系列:向量数据库的应用与畅想
· 从问题排查到源码分析:ActiveMQ消费端频繁日志刷屏的秘密
· 一次Java后端服务间歇性响应慢的问题排查记录
· 互联网不景气了那就玩玩嵌入式吧,用纯.NET开发并制作一个智能桌面机器人(四):结合BotSharp
· Vite CVE-2025-30208 安全漏洞
· 《HelloGitHub》第 108 期
· MQ 如何保证数据一致性?
· 一个基于 .NET 开源免费的异地组网和内网穿透工具