精华内容
下载资源
问答
  • input textarea自动换行
    2018-01-29 20:56:04
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
    "http://www.w3.org/TR/html4/loose.dtd">  
    <html>  
        <head>  
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
            <title>auto_input</title>  
            <meta name="generator" content="Studio 3 http://aptana.com/">  
            <meta name="author" content="yaoxingda.pt">  
            <!-- Date:  2014-06-26 17:58:14-->  
            <style type="text/css">  
                #container {  
                    height:auto !important;  
                    height:20px; /*假定最低高度*/  
                    min-height:20px;   
                }  
            </style>  
            <script type="text/javascript">  
                var autoTextarea = function(elem, extra, maxHeight) {  
                extra = extra || 20;  
                var isFirefox = !!document.getBoxObjectFor || 'mozInnerScreenX' in window, isOpera = !!window.opera  
                        && !!window.opera.toString().indexOf('Opera'), addEvent = function(  
                        type, callback) {  
                    elem.addEventListener ? elem.addEventListener(type, callback, false)  
                            : elem.attachEvent('on' + type, callback);  
                }, getStyle = elem.currentStyle ? function(name) {  
                    var val = elem.currentStyle[name];  
                    if (name === 'height' && val.search(/px/i) !== 1) {  
                        var rect = elem.getBoundingClientRect();  
                        return rect.bottom - rect.top - parseFloat(getStyle('paddingTop'))  
                                - parseFloat(getStyle('paddingBottom')) + 'px';  
                    };  
                    return val;  
                } : function(name) {  
                    return getComputedStyle(elem, null)[name];  
                }, minHeight = parseFloat(getStyle('height'));  
                elem.style.maxHeight = elem.style.resize = 'none';  
                var change = function() {  
                    var scrollTop, height, padding = 0, style = elem.style;  
                    if (elem._length === elem.value.length)  
                        return;  
                    elem._length = elem.value.length;  
      
                    if (!isFirefox && !isOpera) {  
                        padding = parseInt(getStyle('paddingTop'))  
                                + parseInt(getStyle('paddingBottom'));  
                    }  
                    ;  
                    scrollTop = document.body.scrollTop  
                            || document.documentElement.scrollTop;  
                    elem.style.height = minHeight + 'px';  
                    if (elem.scrollHeight > minHeight) {  
                        if (maxHeight && elem.scrollHeight > maxHeight) {  
                            height = maxHeight - padding;  
                            style.overflowY = 'auto';  
                        } else {  
                            height = elem.scrollHeight - padding;  
                            style.overflowY = 'hidden';  
                        };  
                        style.height = height + extra + 'px';  
                        scrollTop += parseInt(style.height) - elem.currHeight;  
                        document.body.scrollTop = scrollTop;  
                        document.documentElement.scrollTop = scrollTop;  
                        elem.currHeight = parseInt(style.height);  
                    };  
                };  
                addEvent('propertychange', change);  
                addEvent('input', change);  
                addEvent('focus', change);  
                change();  
            };  
            </script>  
        </head>  
        <body >  
            <div>自适应宽度</div>  
            <div>   
                <div id="container"><textarea  id="txtarea_id"></textarea> </div>  
                <div>aaaaaaaaaa</div>  
                <div>bbbbbbbbbbbbb</div>  
            </div>  
        </body>  
        <script>  
            autoTextarea(document.getElementById("txtarea_id"),1);  
        </script>  
    </html>  

    更多相关内容
  • 发布于2009年5月,由RyanDahl开发,是一个基于Chrome V8引擎的JavaScript运行环境,使用了一个事件驱动、非阻塞式I/O模型,让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等...

    node.js可以做什么

    对一些特殊用例进行优化,提供替代的API,使得V8在非浏览器环境下运行得更好,V8引擎执行Javascript的速度非常快,性能非常好,基于ChromeJavaScript运行时建立的平台,用于方便地搭建响应速度快、易于扩展的网络应用。

    发布于2009年5月,由RyanDahl开发,是一个基于Chrome V8引擎的JavaScript运行环境,使用了一个事件驱动、非阻塞式I/O模型,让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言。

    功能模块:Node使用Module模块去划分不同的功能,以简化应用的开发。Modules模块有点像C++语言中的类库。

    每一个Node的类库都包含了十分丰富的各类函数,比如http模块就包含了和http功能相关的很多函数,可以帮助开发者很容易地对比如http,tcp/udp等进行操作,还可以很容易的创建http和tcp/udp的服务器。

    要在程序中使用模块是十分方便的,只需要如下:在这里,引入了http类库,并且对http类库的引用存放在http变量中了。

    这个时候,Node会在我们应用中搜索是否存在node_modules的目录,并且搜索这个目录中是否存在http的模块。

    如果找不到这个目录,则会到全局模块缓存中去寻找,用户可以通过相对或者绝对路径,指定模块的位置。以上内容参考:百度百科。

    谷歌人工智能写作项目:小发猫

    Node.js是什么,它是用来做什么的?

    是一个基于ChromeV8引擎的JavaScript运行时typescript中文版教程,typescript实战指南。是一个基于ChromeV8引擎的JavaScript运行环境。使用了一个事件驱动、非阻塞式I/O的模型。

    Node是一个让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言。

    [2]发布于2009年5月,由RyanDahl开发,实质是对ChromeV8引擎进行了封装。Node对一些特殊用例进行优化,提供替代的API,使得V8在非浏览器环境下运行得更好。

    V8引擎执行Javascript的速度非常快,性能非常好。Node是一个基于ChromeJavaScript运行时建立的平台,用于方便地搭建响应速度快、易于扩展的网络应用。

    Node使用事件驱动,非阻塞I/O模型而得以轻量和高效,非常适合在分布式设备上运行数据密集型的实时应用。

    node.js能干什么?

    1.JavaScript为HTML设计师提供了一种编程工具HTML创作者往往都不是程序员,但是JavaScript却是一种只拥有极其简单的语法的脚本语言!

    几乎每个人都有能力将短小的代码片断放入他们的HTML页面当中。

    2.JavaScript可以将动态的文本放入HTML页面类似于这样的一段JavaScript声明可以将一段可变的文本放入HTML页面:document.write(""+name+"")3.JavaScript可以对事件作出响应可以将JavaScript设置为当某事件发生时才会被执行,例如页面载入完成或者当用户点击某个HTML元素时。

    4.JavaScript可以读写HTML元素JavaScript可以读取及改变HTML元素的内容。

    5.JavaScript可被用来验证数据在数据被提交到服务器之前,JavaScript可被用来验证这些数据。

    6.JavaScript可被用来检测访问者的浏览器JavaScript可被用来检测访问者的浏览器,并根据所检测到的浏览器,为这个浏览器载入相应的页面。

    7.JavaScript可被用来创建cookiesJavaScript可被用来存储和取回位于访问者的计算机中的信息。

    前端用nodejs能做什么

    到底是什么?是一个JavaScript的编译环境,当前端语言JavaScript在写完之后可以交给进行编译和解释,它的存在对于JavaScript有了质的飞跃。

    下面就是一个简单的命令#node目前,在大部分领域都占有一席之地,尤其是I/O密集型的。比如Web开发,微服务,前端构建等。

    不少大型网站都是使用作为后台开发语言的,用的最多的就是使用做前端渲染和架构优化,比如淘宝双十一、去哪儿网的PC端核心业务等。

    另外,有不少知名的前端库也是使用开发的,如Webpack是一个强大的打包器,React/Vue是成熟的前端组件化框架。

    通常被用来开发低延迟的网络应用,也就是那些需要在服务器端环境和前端实时收集和交换数据的应用(API、即时聊天、微服务)。

    阿里巴巴、腾讯、Qunar、百度、PayPal、道琼斯、沃尔玛和LinkedIn都采用了框架搭建应用。

    另外,编写的包管理器npm已成为开源包管理了领域最好的生态,直接到2017年10月份,有模块超过47万,每周下载量超过32亿次,每个月有超过700万开发者使用npm。

    是一个对于前端工作者不可或缺的工具。尤其是对于JavaScript有着巨大的提升,现阶段的应用已经有了非常蓬勃的发展。对于的学习和熟练运用,必不可少!

    nodejs可以用来做什么

    1、nodejs搭配MongoDB作后端;2、nodejs搭配“终端”作前端的编译工具使用;3、编辑一些小工具,例如“网络爬虫”啥的;4、在不使用浏览器的控制台功能时,可用nodejs达到同样的目的,如下面两张图所示:

    nodejs 具体是做什么用的

    是一个运行在chromeJavascript运行环境下(俗称GoogleV8引擎)的开发平台,用来方便快捷的创建服务器端网络应用程序。

    你可以把它理解为一个轻量级的JSP或PHP环境,但是用来开发Web应用的话,有时要便捷很多。很多人都不明白,为什么一个javascript的东西用在了服务器端的开发上。

    一般认为javascript是浏览器端的脚本语言,但是google将其再开发,用来作为服务器端脚本环境,其性能自称比Python、Perl、PHP还要快。

    的最大优点是处理并行访问,如果一个web应用程序同时会有很多访问连接,就能体现使用的优势。另一个好处是,使用javascript作为服务器端脚本语言,可以消除一些与浏览器端js脚本的冲突。

    甚至发挥javascript动态编程的特性,在服务器与浏览器之间建立直接的动态程序。

    node能做什么?

    是一个运行在chromeJavascript运行环境下(俗称GoogleV8引擎)的开发平台,用来方便快捷的创建服务器端网络应用程序。

    的优点是:1、处理并行访问,如果一个web应用程序同时会有很多访问连接,就能体现使用的优势。2、使用javascript作为服务器端脚本语言,可以消除一些与浏览器端js脚本的冲突。

    甚至发挥javascript动态编程的特性,在服务器与浏览器之间建立直接的动态程序。

    node.js是什么

    是一个基于ChromeV8引擎的 JavaScript 运行环境。使用了一个事件驱动、非阻塞式I/O的模型。

    Node是一个让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby 等服务端语言平起平坐的脚本语言。

    发布于2009年5月,由RyanDahl开发,实质是对ChromeV8引擎进行了封装。Node对一些特殊用例进行优化,提供替代的API,使得V8在非浏览器环境下运行得更好。

    V8引擎执行Javascript的速度非常快,性能非常好。Node是一个基于ChromeJavaScript运行时建立的平台,用于方便地搭建响应速度快、易于扩展的网络应用。

    Node使用事件驱动,非阻塞I/O 模型而得以轻量和高效,非常适合在分布式设备上运行数据密集型的实时应用。扩展资料:Node采用一系列“非阻塞”库来支持事件循环的方式。

    本质上就是为文件系统、数据库之类的资源提供接口。向文件系统发送一个请求时,无需等待硬盘(寻址并检索文件),硬盘准备好的时候非阻塞接口会通知Node。

    该模型以可扩展的方式简化了对慢资源的访问,直观,易懂。尤其是对于熟悉onmouseover、onclick等DOM事件的用户,更有一种似曾相识的感觉。

     

    展开全文
  • Textarea 自动换行实现

    万次阅读 2018-05-07 18:15:14
    前端页面使用 Textarea 来输入内容时,可能会有这样的需求,要求用户在指定的位置处自动换行,指定位置处一般就是指定用户输入一定长度的字符。如下图所示: 而我们知道 Textarea 在默认情况下不会添加自动换行...

    前端页面使用 Textarea 来输入内容时,可能会有这样的需求,要求用户在指定的位置处自动换行,指定位置处一般就是指定用户输入一定长度的字符。如下图所示:
    这里写图片描述

    而我们知道 Textarea 在默认情况下不会添加自动换行标记,也就是说 Textarea 如果不做处理,用户输入的始终是一行数据,保存到数据库中也是一行数据。这样在其他地方展示时就会有数据丢失的情况,本篇文章我们就来实现 Textarea 所见即所得的一个效果。

    实现思路:
    textarea 添加 cols 和 wrap 属性,其中 wrap 设置成 hard,表示上传到服务器的内容会自动添加换行符,外层使用 div 联动,优化 textarea 的显示效果

    实现代码:

    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body>
    
    
        <div id="divTest" 
          style="width: 100%;height:380px;border:1px solid blue;overflow-y: auto;resize:both" >
          <textarea  
              cols = "72" 
              rows="24"
              wrap="hard" 
              style="overflow:hidden;resize:none;border:0px solid blue;display:block;"  
              id="textarea">
          </textarea>
      </div>
    
    
        <script type="text/javascript">
        // 设置div高度
        var textareaWidth = document.getElementById("textarea").offsetHeight;
        document.getElementById("divTest").style.height=textareaWidth;
        var address = document.getElementById("textarea"); 
    
        autoTextarea(address);
    /**  
     * 参考网上资料
     * 文本框根据输入内容自适应高度
     * @param                {HTMLElement}           输入框元素
     * @param                {Number}                设置光标与输入框保持的距离(默认0)
     * @param                {Number}                设置最大高度(可选)
     */
     function autoTextarea(elem, extra, maxHeight) {
      extra = extra || 0;
      // 浏览器判断
      var isFirefox = !!document.getBoxObjectFor || 'mozInnerScreenX' in window, isOpera = !!window.opera && !!window.opera.toString().indexOf('Opera'),
    
      addEvent = function (type, callback) {
        elem.addEventListener ? elem.addEventListener(type, callback, false) : elem.attachEvent('on' + type, callback);
      },  
    
      getStyle = elem.currentStyle ? function (name) {
        var val = elem.currentStyle[name];
    
        if (name === 'height' && val.search(/px/i) !== 1) {
          var rect = elem.getBoundingClientRect();
          return rect.bottom - rect.top - parseFloat(getStyle('paddingTop')) - parseFloat(getStyle('paddingBottom')) + 'px';
        };
    
        return val;
      } : function (name) {
        return getComputedStyle(elem, null)[name];
      },
    
    
      minHeight = parseFloat(getStyle('height'));
      elem.style.resize = 'none';
      var change = function () {
        var scrollTop, height,
        padding = 0,
        style = elem.style;
        if (elem._length === elem.value.length) {
          return;
        }
        elem._length = elem.value.length;
        if (!isFirefox && !isOpera) {
          padding = parseInt(getStyle('paddingTop')) + parseInt(getStyle('paddingBottom'));
        };
    
        scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
        elem.style.height = minHeight + 'px';
    
        if (elem.scrollHeight > minHeight) {
          if (maxHeight && elem.scrollHeight > maxHeight) {
            height = maxHeight - padding;
            style.overflowY = 'auto';
          } else {
            height = elem.scrollHeight - padding;
            style.overflowY = 'hidden';
          };
          style.height = height + extra + 'px';
          scrollTop += parseInt(style.height) - elem.currHeight;
          document.body.scrollTop = scrollTop;
          document.documentElement.scrollTop = scrollTop;
          elem.currHeight = parseInt(style.height);
        };
      };
    
      addEvent('propertychange', change);
      addEvent('input', change);
      addEvent('focus', change);
      change();
    };
    
    
    </script>
    </body>
    </html>

    最后实现效果:
    这里写图片描述

    展开全文
  • input标签能换行么?textarea标签属性

    千次阅读 2020-09-19 17:34:42
    input标签不能换行!!!! 想做文本框并且要换行的话用textarea标签就行,并且可以实现自动换行,不需要另加属性。

    input标签不能换行!!!!

    想做文本框并且要换行的话用textarea标签就行,并且可以实现自动换行,不需要另加属性。

    展开全文
  • textarea自动换行,且文本框根据输入内容自适应高度。效果如下: 不好的写法:; width:100%"> <tbody>
  • textarea换行问题

    2021-03-09 09:18:29
    在数据提交的时候,将textarea内的换行(\n)都改成<br> Description.replace(/\n/g,'<br>') 在重新获取数据编辑的时候,再将所有的<br>换成\n letreg=newRegExp('<br>','g') ...
  • 加入 wrap="off" 属性,如: <textarea wrap="off"></textarea>
  • 监听textarea换行

    2021-12-25 19:54:28
    var autoTextarea = function (elem, extra, maxHeight) { extra = extra || 0;... addEvent('input', change); addEvent('focus', change); change(); }; //使用 autoTextarea(document.getElementById(id));
  • 文本框回车换行
  • Jquery实现textarea自动换行

    千次阅读 2015-07-14 16:27:23
    今天做一个在线聊天小程序的时候,利用jquery把文本框中的内容放入文本域...TextArea里面的原始换行是"\n\r",用text()取的时候,换行变成了 "\r",用val()取的时候,换行变 成"\n",于是想到把改成\n问题解决 ht
  • div模拟textarea实现自动换行

    千次阅读 2019-05-05 19:50:50
    div加上属性contenteditable="true"实现自动换行效果 补充: 1、实现有提示语,输入后提示语消失效果(input的placeholder效果) div上加上placeholder="提示语",此时暂无效果 css文件中配置: #div:empty::...
  • type="textarea" :placeholder="placeholder" resize="none" @input="handleTextareaInput" @keydown.enter.native="handleTextareaKeydown" v-model="ids" /> handleTextareaKeydown(){ let e = window...
  • <Input.TextArea disabled={true} autoSize={{ minRows: 8, maxRows: 10 }} value="{0}:订单支付金额&#13;{1}:用户点击落地页" />
  • 使用JS解决TextArea换行失效
  • 开发商问题反馈: 输入框界面代码: <el-form-item>...el-input v-model="backForm.replyMessage" type="textarea" placeholder="请输入回复"> </el-input> </el-form-item> .......
  • textarea里显示换行

    千次阅读 2020-12-29 10:49:08
    在easyui中的datagrid中使用行内编辑时textarea换行保存到mysql数据库为\n在textarea中输入回车符在js读取textarea中的值有\r\n然后到业务层转换到string中就有可能变成空格形式然后被存入数据库,当在取出此值的...
  • <!DOCTYPE html> <html> <head> <title>css3 语法实现div模拟Input</title> <style type="text/css"> /* div模拟输入框*/ .imitate-input{ ...
  • TextArea换行数据回显页面不换行问题 给回显控件上加: style = "white-space: pre-line; " 样式,不管是td、span等,就可以识别换行了。
  • <el-input type="textarea" placeholder="请输入内容" v-model="windowArr.textarea" @keyup.native="SendEvent($event)"> </el-input> ``` JS ``` SendEventOne(event){ if (event.keyCode === 13) {...
  • input不支持自动换行解决办法

    万次阅读 2018-08-15 10:37:07
    textareainput input不支持换行textarea: 1.支持换行; 2.左边字体要想跑向左上角需要加代码; &lt;textarea name="" id="" cols="" rows="" style="...
  • } 自动换行: div{ word-wrap:break-word; word-break:normal; } 强制不换行 white-space : normal | pre | nowrap | pre-wrap | pre-line | inherit normal:默认;空白会被浏览器忽略。 pre:空白会被浏览器保留...
  • textarea 自动换行缩进 分享

    千次阅读 2016-06-03 15:07:49
    html页面部分,也在body中: 出差说明 javascript部分: //设置文本域自动换行 js var textt = document.getElementById("textt"); //用户看到的文本框 var sha
  • 如题 其实很简单,只是我没想到,type = ... <el-row> <el-col :span="24"> 参数信息" prop="info"> <el-input type="textarea" v-model="viewRuleForm.info"></el-input> </el-form-item> </el-col> </el-row>
  • <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">...textarea name="" i.
  • input按回车换行

    2020-12-08 14:51:45
    需求描述:页面是table里面嵌入input,用户要求按回车去下一个input 之前由于用到elementUI的,用于改变许多类型,之后就自己用原生的input去实现 具体代码: <input type="number" :ref="`ipt` + index" :...
  • 这次给大家带来怎么解决IE11的textarea换行这个BUG,我们知道textarea在ie11下,内容超出文本框后就不换行了,那么,解决IE11的textarea换行BUG的注意事项有哪些? 下面就是实战案例,一起来看一下。 textarea{...
  • 文本域自动换行、高度自增,采用以下方式: html: <textarea rows="1" class="answerTextArea" maxlength="60"></textarea> css: .answerTextArea{ width: 100%; height: auto; ...
  • 之前做一个textarea内容添加页面,要求能够换行,网上搜了搜是因为数据库自动把&lt;br&gt;替换成了\n,可以通过jquery替换回来,我试了试感觉没有效果,可能因为我是菜鸟。最后在一个相同问题的帖子下的回复...
  • textarea内部换行实现

    2019-07-12 20:20:55
    当在使用textarea的时候,有一次需求,需要做到自定义换行,而不是通过textarea定宽来自动换行,其实在html中可以直接通过<br/>来换行,同时也想到用\n来实现换行,其结果是根本不鸟你。 <textarea cols...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 17,284
精华内容 6,913
关键字:

input textarea自动换行