textarea 手机端无法换行_在某一些手机的安卓浏览器上textarea标签的placeholder不自动换行的解决方法...

最近在做移动端的web开发的时候，定义了一个textarea，并使用placeholder写的提示语。在一些手机上发现，placeholder的内容不会自动换行，而是超出了屏幕的显示区域，隐藏掉了，很是无语。

因为在PC端的浏览器和iphone上并没有这个问题，会自动换行的，而且安卓上大部分都可以的(比如小米，乐视，华为，三星)，测试没有问题，但但但在一部三星手机(感觉是挺老的机子了)才出现这个问题。个人觉得这个是安卓老老浏览器的bug，感觉挺奇怪的。可能这部三星测试机是垃圾山塞货(火了，得骂一下哈哈)，但没有办法，只能改了。。。

那么如何让它自动换行呢？发现可以通过以下几种方法实现

一、直接在placeholder里换行出加上

比如placeholder=”

第一行请输入提示内容的我不知道怎么换行了

，

第二行在一些神机上发现安卓浏览器有bug”。

如图：(因为编辑要过滤掉，所以截图)

二、用css的方法

::-webkit-input-placeholder {

color: transparent;

}

::-webkit-input-placeholder:before {

display: block;

color: #999;

content: "第一行请输入提示内容 \A 第二行请输入提示内容";

}

不过发现此方法的placeholder值不能为空(placeholder=””)，那么可以这样写placeholder=” ”。

三、用js和换行符\n实现

// 换行符\n实现

var placeholder = '第一行请输入提示内容\n第二行请输入提示内容';

$('#js-placeholder1').val(placeholder);

$('#js-placeholder1').focus(function(){

if($(this).val() === placeholder){

$(this).val('');

}

});

$('#js-placeholder1').blur(function(){

if($(this).val() ===''){

$(this).val(placeholder);

}

});

4、用js动态创建一个元素模拟来实现，通过css定位到textarea上

这种在pc端实现比较常见，因为有ie低版本浏览器不支持html5的placeholder属性，也有很多写好的插件

textarea 手机端无法换行_在某一些手机的安卓浏览器上textarea标签的placeholder不自动换行的解决方法...相关推荐

textarea 手机端无法换行_处理textarea中的换行和空格
当我们使用 textarea 在前台编辑文字,并用 js 提交到后台的时候,空格和换行是我们最需要考虑的问题.在textarea 里面,空格和换行会被保存为/s和/n,如果我们前台输入和前台显示的文字 ...
zxing换行_为什么我的word里的横线上写完一行字不能自动换行，？
匿名用户 7级 2010-10-21 回答目前,我暂时知道的有:1你在WORD中同时按Ctrl+A时,可以选择整篇文章.2.F1 显示当前程序或者windows的帮助内容. F2 当你选 ...
HTML5响应式手机模板：电商网站设计——歪秀商城手机端开发静态页面HTML+CSS+JavaScript 手机模板wap 手机网站模板企业手机网站模板...
HTML5响应式手机模板:电商网站设计--歪秀商城手机端开发静态页面HTML+CSS+JavaScript 手机模板wap 手机网站模板企业手机网站模板手机网站模板手机模板响应式手机网站 ht ...
HTML5响应式手机模板：电商网站设计——歪秀商城手机端开发静态页面HTML+CSS+JavaScript 手机模板wap 手机网站模板企业手机网站模板
HTML5响应式手机模板:电商网站设计--歪秀商城手机端开发静态页面HTML+CSS+JavaScript 手机模板wap 手机网站模板企业手机网站模板手机网站模板手机模板响应式手机网站 ht ...
Android实现EditText禁止输入换行符但可以根据内容自动换行的解决方法
Android实现EditText禁止输入换行符但可以根据内容自动换行的解决方法参考文章: (1)Android实现EditText禁止输入换行符但可以根据内容自动换行的解决方法 (2)https: ...
服务器端往手机端推送数据的问题（手机解决方案）
1.方案一: 思路:使用socket连接,在手机端开个socketserver,然后服务器端连接手机端,实现服务器端的不定时发送数据. MIDlet关闭时, 你可以通过sms激活它. midlet运行 ...
python手机端下载-Python3,x：如何进行手机APP的数据爬取
Python3,x:如何进行手机APP的数据爬取一.简介平时我们的爬虫多是针对网页的,但是随着手机端APP应用数量的增多,相应的爬取需求也就越来越多,因此手机端APP的数据爬取对于一名爬虫工程师来 ...
php判断客户端是微信,PHP判断是手机端还是PC端以及PHP判断是否是微信浏览器
这篇文章主要为大家详细介绍了PHP判断是手机端还是PC端,以及PHP判断是否是微信浏览器,具有一定的参考价值,感兴趣的小伙伴们可以参考一下本文实例为大家分享了PHP判断的两个实例,一是PHP判断是手 ...
微信登录界面安卓代码_【雷电说明书】安卓模拟器微信登录闪退，转圈，停止运行解决方法...
雷电模拟器微信登录不上,微信闪退,模拟器微信停止运行等等问题一直在论坛出现,雷电模拟器最新版本已经解决了大部分的微信登录问题了.还是会有小部分伙伴出现了难以解决的问题,微信停止运行一般是建议安装最新雷 ...

textarea 手机端无法换行_在某一些手机的安卓浏览器上textarea标签的placeholder不自动换行的解决方法...

textarea 手机端无法换行_在某一些手机的安卓浏览器上textarea标签的placeholder不自动换行的解决方法...相关推荐

最新文章

热门文章