input,textarea限制字数,实时绑定

更新日期: 2018-12-04阅读量: 1931标签: 表单

1.在input 或 textarea中加属性 

maxlength="10"


 2.js判断

function limitImport(str,num){
    $(document).on('input propertychange',str,function(){
        var self = $(this);
        var content = self.val();
        if (content.length > num){
            self.val(content.substring(0,num));
        } 
        self.siblings('span').text(self.val().length+'/'+num);
    });
}

//用法示例 

limitImport(‘.pushTe’,50);

没有什么特殊需要感觉还得第一个实用些 


拓展: 实时绑定功能 

$(document).bind('input propertychange','.class',function(){
    // console.log($(this).val().length)
    if($(this).val().length<=20){
        document.getElementById('tiCont').innerhtml = $(this).val().length;
    }
});

二种输入标签的实时绑定方式 。 需求:框后面有显示字数  

 

站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: https://www.fly63.com/article/detial/1488

表单提交type=submit和type=image的区别

type=image默认是sumbit,不用再添加onclick事件提交,否则会发生表单被提交两次的情况;在onclick事件中添加重置方法

vue表单校验

两个文件,一个写逻辑,一个写校验规则;特点:逻辑简单,代码量少,够用;不想看代码直接新建这两个文件复制代码,看最下面的使用方法;

JS使用textarea模拟post提交表单

textarea代表HTML表单多行输入域,textarea标签是成对出现的,以<textarea>开始,以</textarea>结束。cols -- 多行输入域的列数,rows -- 多行输入域的行数

小程序/网页实现textarea高度随内容自动改变

textarea默认的高度不是对着内容变化,而是随着内容增多,出现了滚动条。目前的需求是实现一个能够输入的textarea,并且高度跟着内容变化。以及小程序的textarea高度随内容自动改变的实现

PHP如何解决表单重复提交

表单隐藏域中存放session(表单被请求时生成的标记)。采用此方法在接收表单数据后,检查此标志值是否存在,先进行删除,然后处理数据; 若不存在,说明已提交过,忽略本次提交。加载提交的页面时候

使用Vue Composition API写出清晰、可扩展的表单

表单是前端开发中最棘手的部分之一,您可能会在其中发现很多混乱的代码。基于组件的框架,如 Vue.js,在提高前端代码的可扩展性方面做了很多工作,但是表单的问题仍然存在。

阻止表单的默认提交事件

表单一点击提交按钮(submit)必然跳转页面,如果表单的action为空也会跳转到自己的页面,即效果为刷新当前页。 如下,可以看到一点击提交按钮

Js使用表单元素验证表单

最简单的HTML结构:网站最基础的就是注册,它是一个系统的交互基础;因为用户最后要去点击\\\"注册\\\"按钮,所以我们就在\\\"注册\\\"按钮上添加一个onclick事件属性,引用eg.regCheck()

js如何获取checkbox被选中的值?

通过复选框的name属性,遍历后将被选中的复选框的值输出:checkbox[index].nextSibling.nodeValue: 获取的是checkbox中标签包裹的文本值,建立一个数组,使用push 方法将被选中的元素保存到数组

react表单_受控组件与非受控组件

在 React 中,表单元素通过组件的 state 属性来自己维护 state,并根据用户输入调用setState()来进行数据更新,使 React 的 state 成为“唯一数据源”,被 React 以这种方式控制取值的表单输入元素就叫做“受控组件”。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!