截选于网上
1、onchange事件与onpropertychange事件的区别：
onchange事件在内容改变（两次内容有可能还是相等的）且失去焦点时触发；onpropertychange事件却是实时触发，即每增加或删除一个字符就会触发，通过js改变也会触发该事件，但是该事件IE专有。
2、oninput事件与onpropertychange事件的区别：
oninput事件是IE之外的大多数浏览器支持的事件，在value改变时触发，实时的，即每增加或删除一个字符就会触发，然而通过js改变value时，却不会触发；onpropertychange事件是任何属性改变都会触发的，而oninput却只在value改变时触发，oninput要通过addEventListener()来注册，onpropertychange注册方式跟一般事件一样。（此处都是指在js中动态绑定事件，以实现内容与行为分离）
3、oninput与onpropertychange失效的情况：
（1）oninput事件：a). 当脚本中改变value时，不会触发；b). 从浏览器的自动下拉提示中选取时，不会触发。
（2）onpropertychange事件：当input设置为disable=true后，onpropertychange不会触发。
|
例子：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd
">
<html>
<head>
<title> New Document </title>
<script>
function cc(val){
document.getElementById('textid2').value=val.value;
}
</script>
</head>
<body>
<input type="text" id="textid1" name="textid1" onpropertychange="cc(this);"><br>
<input type="text" id="textid2" name="textid2"><br>
</body>
</html>
2、下面是jQuery的写法
<!DOCTYPE html>
<html>
<head>
<style>
p { color:blue; margin:8px; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<input type="text" id="inputid1" value="这里可以什么都不写"/><br><br>
<input type="text" id="inputid2" />
<script>
$("#inputid1").keyup(function () {
var value = $(this).val();
$("#inputid2").val(value);
}).keyup();
</script>
</body>
</html>
分享到：
相关推荐
那我们能不能找到另外一个事件来代替onpropertychange 呢？经过翻阅资料得知，在其他浏览器下可以使用oninput 事件来达到同样的效果。 oninput 事件可以在输入框值发生变化时被触发，可以实时监听输入框值的变化。...
然而，onpropertychange事件有一些局限性，比如不会在禁用状态的元素中触发，以及从脚本中修改输入框值时不会触发。文章提到，IE9以下版本不支持oninput事件，可以使用onpropertychange作为替代方案。 文中还包含了...
在 Web 开发中，实时监听输入框值的变化是一个常见的需求，例如自动完成功能、实时搜索、表单验证等。在这个资源中，我们将介绍 JS 与 jQuery 实时监听输入框值的 oninput 与 onpropertychange 方法，并通过实例分析...
主要介绍了js与jquery实时监听输入框值的oninput与onpropertychange方法,实例分析了oninput与onpropertychange实现下拉框里自动匹配关键字实时监听文本框value值变化的功能,需要的朋友可以参考下
结合上述知识点，我们可以编写一个示例代码，该代码不仅可以在非 IE 浏览器中使用 `oninput` 事件，还能在 IE 浏览器中使用 `onpropertychange` 事件。这样就可以为不同的浏览器用户提供一致的体验： ```html <!...
onchange在用于文本框输入框时,有一个明显的不足. 事件不会随着文字的输入而触发,而是等到文本框失去焦点(onblur)时才会触发. 也就是没有即时性! 在IE下,可以用onpropertychange来代替onchange事件,当文本框有任何...
- **输入限制和导航**：利用`onkeyup`事件监听键盘输入，当达到最大长度时自动聚焦下一个输入框。 - **数据收集和验证**：通过`for`循环和数组操作，收集多个文本框的值，并进行简单数据验证。 ### 综合示例解析 ...
**技巧描述：** 创建一个无背景色且具有白色边框的输入框。 **代码实现：** ```html ;border:1px solid #ffffff"> ``` **解析：** 这段代码定义了一个文本框，通过`style`属性设置样式。其中`background:...
用户在输入数据时，文本框的状态变化会触发一系列事件，这些事件可以帮助开发者实现更丰富的用户体验。本文将详细讲解如何利用JavaScript和jQuery来处理文本框的焦点获取与失去事件。 首先，我们来看JavaScript原生...
在实现字符统计功能时，一般会定义一个回调函数，该函数在每次输入事件触发时被调用，并返回当前输入框中字符的长度。根据字符数量，可以实时更新显示在页面上的剩余字符数提示信息。如果字符数达到设定的最大长度...
总的来说，处理跨浏览器的输入事件变化需要了解各种浏览器对特定事件的支持情况，并采取适当的策略进行兼容性处理。在实际项目中，可以使用工具库如jQuery或Modernizr来简化这样的工作，它们已经处理了大部分浏览器...
- **Value 属性**: 每个`<input>`元素都有一个`value`属性，该属性存储了用户输入的信息。 - **JavaScript**: 一种广泛使用的编程语言，用于实现网页上的动态效果。 - **jQuery**: 一个快速、简洁的JavaScript库，...
在前端开发中，对input文本框内容的监控是一个常见需求，特别是当我们希望在用户输入或者输入内容改变时即时做出响应。本文将详细介绍如何使用JavaScript捕获input文本框内容改变事件，以及不同事件触发时机和使用...
这段JavaScript代码会监听文本框的`input`事件，每当输入框内容变化时，它会更新图像元素的`src`属性，展示用户输入的图片URL。 为了处理各种可能的URL格式，确保图片能够正确加载，我们可以添加一些额外的验证逻辑...
例如，假设有一个文本输入框，用户在其中输入文字，然后立即点击另一个元素，使得输入框失去焦点，这时 `onchange` 事件会被触发。但如果用户输入文字后未点击其他地方，`onchange` 就不会触发。这就是 `onchange` ...
比如当字数超出限制时，按钮的样式会改变，并且会开启一个间隔定时器来实现文本框背景的闪烁效果。 最后，提供的代码中还包含了在线演示的链接和下载链接，以便于理解和学习。 总体而言，该功能的实现结合了前端...
jQuery是一个广泛使用的JavaScript库，它极大地简化了DOM操作和事件处理。在jQuery中，事件绑定是实现交互性的重要手段。在本文中，我们将深入探讨如何使用jQuery绑定事件，特别是针对文本框（input textarea）的...
`onpropertychange`是Internet Explorer特有的事件，用于检测DOM元素属性的变化，包括文本框（`<input>`或`<textarea>`）中的文本变化。然而，这个事件并不被其他浏览器（如Firefox、Chrome、Safari等）支持。因此...