`
jsczxy2
  • 浏览: 1273671 次
  • 性别: Icon_minigender_1
  • 来自: 常州
文章分类
社区版块
存档分类
最新评论

jquery控制文本框输入数字变化后做操作

阅读更多

1.最简单方式绑定onkeyup事件

2.jQuery.fn.extend({

propertychange: function(fn) {

if (!+ [1, ] != true) {

$(this).get(0).addEventListener("input", fn, false)

}

$(this).bind("propertychange", fn);

return this

}

});

 

以下是例子:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script  type="text/javascript">
jQuery.fn.extend({
	propertychange: function(fn) {
		if (!+ [1, ] != true) {
			$(this).get(0).addEventListener("input", fn, false)
		}
		$(this).bind("propertychange", fn);
		return this
	}
});
</script>
</head>
<body>
<input id="setCont" type="text" value='啊啊'/><span id="count">5</span>
<script>
$('#setCont').propertychange(function(){
    var t = this;
    $('#count').text(t.value.length);
});
</script>

</body>
</html>
分享到:
评论

相关推荐

    js 控制文本框只能输入数字 自己开发了一个jquery插件

    在JavaScript和jQuery的世界里,开发一个插件来控制文本框(input[type="text"])只能输入数字是一项常见的任务。这通常涉及到对用户输入的实时验证,以确保输入的数据符合预期的格式。以下是一个关于如何自己开发...

    jquery 鼠标滚轮控制文本框数字改变

    本资源探讨了一个特定的应用场景,即“jquery 鼠标滚轮控制文本框数字改变”,这是一个实用的功能,常见于各种需要用户输入数值的交互界面,如调整音量、设置数量或调节滑块等。 当用户在文本框(input[type=...

    基于jQuery输入密码文本框不同颜色渐变显示密码强度特效源码.zip

    这可能使用CSS的渐变属性(linear-gradient或radial-gradient)结合jQuery的DOM操作来实现,随着密码强度的变化,颜色从弱到强平滑过渡。 4. **DOM操作**:jQuery提供了方便的DOM操作方法,如`css()`来改变元素的...

    基于jQuery的计算文本框字数的代码

    在探讨基于jQuery计算文本框中字数的功能时,首先需要了解该功能的实现目标,即在用户输入文字的同时计算字数,并给出剩余可输入字数的提示。当输入的字数超过设定的最大值后,需要通过一些视觉反馈(如输入框的闪动...

    jQuery计算文本框字数及限制文本框字数的方法

    6. 防止输入超出限制:通过监听文本框的变化事件,实时更新用户还可以输入的字数。一旦用户输入的字数超过了设定的限制,可以通过禁用文本框、隐藏文本框或者阻止键盘事件等手段,来防止用户继续输入。 7. HTML页面...

    JS与jQuery判断文本框还剩多少字符可以输入的方法

    综上所述,通过原生JavaScript或jQuery配合textlimit插件,我们能够有效地对网站上的文本框输入进行控制,并实时反馈给用户剩余可输入的字符数。这不仅提升了用户体验,也保证了后端处理时数据的一致性和合理性。

    jQuery Spin button 文本框数值自动增减效果.rar

    这款插件利用了JavaScript库jQuery的强大功能,为用户提供了一种直观且易于操作的方式,以便在网页表单中快速调整数字值。通过在文本框旁边添加上下箭头按钮,用户只需点击即可轻松增加或减少数值,而无需手动输入。...

    js与jquery实时监听输入框值的oninput与onpropertychange方法.docx

    在这个资源中,我们将介绍 JS 与 jQuery 实时监听输入框值的 oninput 与 onpropertychange 方法,并通过实例分析了 oninput 与 onpropertychange 实现下拉框里自动匹配关键字实时监听文本框 value 值变化的功能。...

    利用jquery实现验证输入的是否是数字、小数,包含保留几位小数

    在前端开发中,对用户输入进行验证是一个常见的需求,尤其是在需要用户输入数字或小数时。使用jQuery库,我们可以相对容易地实现这样的验证功能。本文将详细介绍如何利用jQuery来验证一个输入值是否为数字或小数,...

    ASP.NET自定义文本框控件(日历、IP、电话、数字等功能集成)

    本文将深入探讨如何创建一个自定义文本框控件,该控件集成了日期选择、电话格式验证、IP地址输入以及焦点事件处理等多种功能。 首先,自定义文本框控件通常通过继承自ASP.NET的基础控件`System.Web.UI.WebControls....

    js实现文本框输入文字个数限制代码

    js实现文本框输入文字个数限制代码,就是一门关于如何利用JavaScript来限制文本框中输入的文字数量的技术。 首先,我们要了解,文本框输入的文字个数限制是通过JavaScript脚本来实现的。在网页中,文本框是通过`...

    文本框数量加减带总金额计算效果源码下载

    JavaScript负责处理用户的输入事件,监听文本框的数量变化,并进行相应的数学运算。jQuery则提供了一套更方便的DOM操作和事件处理API,使得代码编写更为简洁。 在实现这个功能时,首先需要为每个商品的文本框添加...

    超实用的jQuery代码段

    序2 你绝对不可能全部做对的jQuery题 XVI 序3 最流行的前端面试题 XXIII 第1章 jQuery操作网页 1.1 显示或隐藏网页内容 1.2 切换页面的显示或隐藏 1.3 实现幻灯片式的淡入淡出效果 1.4 切换页面的淡入淡出 1.5 页面...

    仿微博提示可输入剩余字数

    5. **正则表达式过滤**:描述中提到“只能输入数字”,我们可以利用JavaScript的正则表达式进行输入验证。例如,`/^\d+$/.test(inputValue)`可以检查输入的是否全为数字。如果不是,则可以清除非数字字符或者阻止...

    JQuery&CSS;&CSS;+DIV实例大全.rar

    2.jQuery字符插件之适合留言板的jquery文本框输入字符限制插件下载 3.jquery实现Tooltip提示(文字、链接、地图锚点),自带5种不同样式 4.jQuery实现支付宝隐藏层提示信息内容的功能 5.jquery实现鼠标划过网址...

    jQuery实现的彩色计算器功能特效源码.zip

    在计算器中,这可能涉及到获取输入数字和运算符的按钮,以及显示结果的文本框。 2. **事件绑定**:jQuery的`.on()`方法可以方便地为按钮绑定点击事件,当用户点击按钮时触发相应的计算逻辑。 3. **数据处理**:...

    jquery-textnumber:jQuery的终极文本数字字段插件

    `jquery-textnumber` 是一个专为jQuery设计的强大文本数字字段插件,它提供了一种高效且灵活的方式来管理输入到文本框中的数字,确保用户输入的数据符合特定的格式和限制。这个插件适用于各种场景,如创建表单、处理...

    jQuery仿新浪微博@功能特效.zip

    1. **文本框监听**:使用jQuery的`.on('input', function() {...})`或者`.keyup(function() {...})`来监听用户在文本框中的输入变化,一旦输入内容改变,就触发相应的处理函数。 2. **正则表达式匹配**:通过正则...

    jQuery插件教程(搜罗了全部插件

    5. **jQuery AlphaNumeric** - 验证输入是否为字母数字组合,确保数据安全性。 ##### 选择框类插件 1. **jQuery ComboBox** - 创建可搜索的选择框,提升用户选择效率。 2. **jQuery controlled dependent (or ...

Global site tag (gtag.js) - Google Analytics