JQueryはinputの中値変化をリアルタイムで傍受する
3379 ワード
JQueryはinputの中値変化をリアルタイムで傍受する
同様に、微博を実現する「xxx文字も入力できる」
oninput,onpropertychange,onchangeの使い方
onchangeトリガイベントは、2つの条件を満たす必要があります.
a)現在のオブジェクト属性が変化し、キーボードまたはマウスイベントによって励起される(スクリプトトリガが無効)
b)現在のオブジェクトが焦点を失う(onblur);
onpropertychangeでは、現在のオブジェクトの属性が変更されるとイベントがトリガーされますが、IE専用です.
oninputはonpropertychangeの非IEブラウザバージョンで、firefoxやoperaなどのブラウザをサポートしていますが、オブジェクトにバインドされている場合、オブジェクトのすべてのプロパティの変更がイベントをトリガーするわけではありません.オブジェクトvalue値が変更された場合にのみ効果的です.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RunJStitle>
<script id="jquery_183" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.8.3.min.js">script>
head>
<body>
<h1 >
input
h1>
<input type="text" id="username" autoComplete='off'>
<div id="result">div>
body>
html>
$(function(){
$('#username').bind('input propertychange', function() {
$('#result').html($(this).val().length + ' characters');
});
})
同様に、微博を実現する「xxx文字も入力できる」
oninput,onpropertychange,onchangeの使い方
onchangeトリガイベントは、2つの条件を満たす必要があります.
a)現在のオブジェクト属性が変化し、キーボードまたはマウスイベントによって励起される(スクリプトトリガが無効)
b)現在のオブジェクトが焦点を失う(onblur);
onpropertychangeでは、現在のオブジェクトの属性が変更されるとイベントがトリガーされますが、IE専用です.
oninputはonpropertychangeの非IEブラウザバージョンで、firefoxやoperaなどのブラウザをサポートしていますが、オブジェクトにバインドされている場合、オブジェクトのすべてのプロパティの変更がイベントをトリガーするわけではありません.オブジェクトvalue値が変更された場合にのみ効果的です.