.one()

.one( eventType, [ eventData ], handler(eventObject) ) 官网原E文: jQuery

描述: 附加一个处理事件到元素。处理函数在每个元素上最多执行一次。

  • version added: 1.1.one( eventType, [ eventData ], handler(eventObject) )

    eventType一个包含一个或多个JavaScript事件类型的字符串,比如"click"或"submit,"或自定义事件的名称。

    eventData将要传递给事件处理函数的数据映射。

    handler(eventObject)每当事件触发时执行的函数。

这种方法是和.bind()相同的 ,但该处理函数第一次调用后就解除绑定。举个例子:

$('#foo').one('click', function() {
  alert('This will be displayed only once.');
});

在代码执行后,点击id为foo的元素将显示警报。随后的每次点击什么都不做。此代码是等效于:

$('#foo').bind('click', function(event) {
  alert('This will be displayed only once.');
  $(this).unbind(event);
});

换句话说,从一个定期绑定处理函数显式调用.unbind()具有完全相同的效果。

Examples:

Example: Tie a one-time click to each div.

<!DOCTYPE html>
<html>
<head>
  <style>
div { width:60px; height:60px; margin:5px; float:left;
background:green; border:10px outset; 
cursor:pointer; }
p { color:red; margin:0; clear:left; }
</style>
  <script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
  <div></div>
<div></div>
<div></div>
<div></div>

<div></div>
<p>Click a green square...</p>
<script>
var n = 0;
$("div").one("click", function(){
var index = $("div").index(this);
$(this).css({ borderStyle:"inset",
    cursor:"auto" });
$("p").text("Div at index #" + index + " clicked." +
  "  That's " + ++n + " total clicks.");
});

</script>

</body>
</html>

Demo:

Example: To display the text of all paragraphs in an alert box the first time each of them is clicked:

$("p").one("click", function(){
alert( $(this).text() );
});
jQuery 1.6 API 中文版Clove整理、修订