`
liumiao2011
  • 浏览: 53114 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JS:完全监视输入框

 
阅读更多

有时候我们在输入框中输入文字,页面上实时显示着输入文字的个数,于是我们给输入框加入keyup,focus,blur事件等,可是还是防止不了鼠标右键复制粘贴。下面的方法可以防止复制粘贴,记下来省了以后用到了重新上网搜。

function monitor(obj){
 if ("\v" == "v") {
  obj.onpropertychange = webChange;
 } else {
  obj.addEventListener("input", webChange, false);
 }
 function webChange()
 {
  //$("#number").html(obj.value.length);
 }

}

参数obj就是被监视的输入框,开头的if("\v" == "v")...是解决浏览器兼容性问题的,函数webChange写输入框改变时的操作。

调用:

monitor($("#content")[0]);

记得obj要传DOM对象,不能是jQuery对象。

分享到:
评论

相关推荐

    vue实现短信验证码输入框

    本文将详细介绍如何使用Vue.js框架来实现一个短信验证码的输入框,并通过示例代码阐述这一过程。 首先,我们要知道短信验证码通常由几位数字组成,这里以5位数字为例,分别对应5个输入框。在Vue中,我们可以使用v-...

    jquery插件表

    - **TypeWatch Plugin**:监视输入框内容变化,达到特定条件时执行相应动作。 - **Text limiter for form fields**:限制用户在输入框中输入的字符数量。 - **Ajax Username Check with jQuery**:实时检查用户名...

    vue限制输入框只能输入8位整数和2位小数的代码

    在Vue中,watch选项允许我们监视数据对象上的属性变化,当属性值发生变化时,可以执行相应的逻辑处理。本场景中使用watch监听器来检测输入框数据的变化,并执行特定的格式验证。 3. 正则表达式的应用: 文章中定义...

    Vue数字输入框组件示例代码详解

    Vue.js是一个流行的前端框架,它允许开发者通过数据驱动的视图来构建单页应用(SPA)。Vue中的组件化开发是其核心特性之一,这使得代码模块化和复用成为可能。这篇文章将深入探讨如何在Vue中创建一个数字输入框组件...

    JQuery模板 :(九) JsRender之JsViews中的JsObserverable

    `JsObservable`对象能够监视数据模型的变化,并通知订阅者这些变化,以便及时更新视图。 **数据绑定** JsViews通过`{{}}`双大括号语法实现数据绑定。这种语法允许我们在HTML模板中嵌入JavaScript表达式,这些...

    【JavaScript源代码】Vue验证用户名是否可用的方法.docx

    Vue.js 是一种流行的前端JavaScript框架,用于构建用户界面。在Vue中,我们可以通过各种方法来实现数据绑定和响应式更新,其中包括对用户输入的实时验证。在提供的文档中,我们看到一个具体的例子,展示了如何在Vue...

    基于vue组件实现猜数字游戏

    在实现该游戏时,我们使用了Vue.js的模板语法,使用`template`属性来定义组件的模板,使用`v-model`指令来实现输入框的双向绑定,使用`watch`函数来监视输入框的变化,并使用`beforeMount`生命周期钩子函数来生成...

    网页广告中JS代码的信息监听示例

    在一些网页广告中提供的JS代码可以进行代码注入,然后监视各种元素, 下面的例子是监视百度输入框的输入的值,然后显示出来, 代码如下: ;(function() { function myfn() { var ssk=document.getElementById(“kw”)...

    Go-godbg-基于Web的gdb前端应用

    5. **命令行接口**:提供gdb的命令行输入框,允许输入gdb原生命令。 6. ** Watches**:可以监视特定变量的变化,实时更新其值。 7. **内存查看**:查看和修改程序内存中的数据。 8. **源代码高亮**:代码显示支持...

    在 Chrome DevTools 中调试 JavaScript

    当用户在输入框 num1 和 num2 中分别输入 6 和 9 后,点击“num1+num2”按钮,预期结果应该是 15,但实际显示为 69,这就需要我们通过调试来找出问题所在。 接下来,我们要进入 Chrome DevTools 的 Sources 面板。...

    深究AngularJS—如何获取input的焦点(自定义指令)

    在上述指令中,我们没有直接使用`watch`,但在某些情况下,我们可能需要监视特定模型的改变来决定何时触发焦点获取,例如: ```javascript scope.$watch(attrs.focusIf, function(newVal, oldVal) { if (newVal && ...

    vue 输入电话号码自动按3-4-4分割功能的实现代码

    - **组件**: 是Vue.js最强大的功能之一,允许开发者通过封装可复用的代码片段来构建大型应用。 #### 2. 实现手机号3-4-4格式功能 - **输入监听**: 监听输入框的内容变化,通过`watch`属性或者计算属性实现。 - **...

    Jquery 监视按键,按下回车键触发某方法的实现代码

    监视按键并响应特定键盘事件是前端开发中常见的需求,其中,利用jquery捕捉和处理回车键的事件就是本文要讨论的主题。 在 jquery 中,监听键盘事件常用的方法有 `.keypress()`, `.keydown()`, 和 `.keyup()`,它们...

    modMoney:一个渐进式Web应用程序,用于在旅途中计划和监视预算

    1. **用户界面交互**:JavaScript驱动用户界面的动态更新,如预算输入框的实时计算、图表的动态渲染等。 2. **本地存储**:通过浏览器的localStorage或IndexedDB API,JavaScript可以将用户的预算数据存储在本地,...

    AngularJS Handbook_ Easy Web App Development

    在这个例子中,`ng-app`指定了当前应用,`ng-controller`关联了一个名为`myCtrl`的控制器,而`ng-model`则实现了输入框和显示文本之间的双向数据绑定。 #### 三、XHRs (XMLHttpRequest) 在Web开发中,XHRs被广泛...

    分析Ajax技术的安全性

    2. **事件监听**:为页面中的所有元素(如输入框、按钮等)绑定键盘输入和鼠标移动等事件监听器。 3. **数据收集**:当用户进行交互操作时,JavaScript会捕获这些事件,并收集相关信息(如按键值、鼠标位置等)。 4....

    实现鼠标软键盘功能1

    4. **安全性考虑**:虽然软键盘能够防止物理键盘被监控,但它并不能完全抵御所有攻击。例如,屏幕抓取或摄像头监视仍然可能暴露输入信息。因此,软键盘应结合其他安全措施,如HTTPS加密传输,以提高安全性。 5. **...

    AngularJS入门教程之数据绑定原理详解

    AngularJS是一个流行的前端JavaScript框架,它通过数据绑定机制简化了Web开发。数据绑定是AngularJS的核心特性之一,能够实现模型和视图之间的同步更新。在AngularJS中,数据绑定主要分为两大类:双向数据绑定和单向...

    movie-app-react:使用React + Redux制作的电影数据库和监视列表制作器应用

    它提供了一系列预先设计和可定制的组件,如按钮、输入框、列表项等,使得开发者能快速构建符合Material Design风格的界面。在这个电影App中,Material-UI可能被用来创建电影卡片、表单控件等元素,提升用户体验。 5...

    微信小程序开发实战.pdf

    - `nodemon`:在Node.js中,`nodemon`是一个实用工具,它可以监视文件变动并自动重启服务器,以实现实时更新。 5. **页面结构** - 进度条组件 `<progress>`:用于在页面中显示进度条效果。 - `...

Global site tag (gtag.js) - Google Analytics