javascript - 调整浏览器大小时更改占位符

标签 javascript html css

我想在浏览器的宽度小于 800 时向文本框添加占位符,但我不确定哪里出错了。

<form class="info">
            <script>add();</script>
            <label>Name</label> <input type="text" class="box" name="name" placeholder="" size="40"><br><br>
</form>

和 JS

<script>
function add(){ 
var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
if (w < 800) {
    document.getElementsByName('name')[0].placeholder='Name';
} else
{
}}
</script>

最佳答案

window.addEventListener('resize', function() {
  var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
  if (w < 800) {
    document.getElementsByName('name')[0].placeholder='Name';
  } else {
    document.getElementsByName('name')[0].placeholder='';
  }
});

DEMO

关于javascript - 调整浏览器大小时更改占位符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43146281/

相关文章:

javascript - 将 'sticky' 定位到容器的底部而不滚动

javascript - 从函数结果中提取时间戳

javascript - 如何防止子字符串结束父字符串?

javascript - 根据行的 Highcharts 工具提示背景(不设置 backgroundColor = null)

html - 移动 <select> 菜单上的箭头位置

javascript - JQuery 选择器标签 SUB 选择器

javascript - firebase orderby key 与 orderby 时间戳,用于分页

javascript - 如何限制一个元素在一分钟内被点击的次数?

javascript - 动态删除表单元素

javascript - 内部 CSS 不适用于 JS