0

我有一个与事件关联的函数，比如 onfocus()，在某些情况下，我希望能够执行默认函数以及一个或多个附加函数。

所以我不想替换原来的函数，但我想附加另一个函数，这样两个函数都会触发。

<div id="mydiv" onfocus="alert('hello');">
if(something == somethingelse) $('#mydiv').onFocus += "alert('world');"

所以在这个例子中，有时只有 Hello 会触发，有时 Hello 和 World 都会触发。

我只是以 onfocus() 和 alert() 为例，这些实际上是我定义的函数。

我该怎么做呢？

4

6 回答 6

0

使用 jQuery 添加焦点事件处理程序

<script>
    $('#mydiv').on('focus', function(){
        //do soemthing
    })
</script>
于 2013-05-10T10:23:54.557 回答
0

如果您使用 jQuery，请不要使用内联事件绑定，请改用以下内容：

$("#mydiv").on("focus", function() {
    alert("hello");
});

// add one more action for the same event
$("#mydiv").on("focus", function() {
    alert("world");
});
于 2013-05-10T10:24:26.277 回答
0

你应该做

$('#myDiv').on('focus', function(){alert('world')});
于 2013-05-10T10:24:27.777 回答
0 
$('#mydiv').focus( function(){
})//This is for the elements which load while the page is loading

或者

$('#mydiv').on('focus', function(){ 

 })  //This is for the elements which will load dynamically after the page load completed.
于 2013-05-10T10:24:31.243 回答
0

如果你不想使用 jQuery 试试这个，它是一个纯 javascript 等价物：

document.getElementById("mydiv").addEventListener("focus", function() { alert('world'); });

如果您希望它与 IE8 和更早版本兼容，您应该尝试

var el = document.getElementById("mydiv");
if(el.addEventListener)
    el.addEventListener("focus", function() { alert('world'); });
else
    el.attachEvent("focus", function() { alert('world'); });
于 2013-05-10T10:24:33.543 回答
0

如果您使用的是 jQuery，您希望使用on()将事件处理程序绑定到元素，而不是内联指定它们

$('#mydiv').on('focus', function () {
    alert('hello');
});

$('#mydiv').on('focus', function () {
    if (something === somethingelse) {
        alert('world');
    }
});

或在这种情况下组合成一个处理函数似乎是合理的

$('#mydiv').on('focus', function () {
    alert('hello');

    if (something === somethingelse) {
        alert('world');
    }
});

像您所做的那样内联指定它们时，只能将一个事件处理程序绑定到该事件，因此如果您想绑定多个事件处理程序，您要么需要改变一个事件处理程序的限制来处理这个问题，要么使用另一种方法，例如DOM 2 级事件或在其之上的抽象（例如 jQuery 的on()函数）。

当要绑定处理程序的元素存在于 DOM 中时，需要绑定事件处理程序。为此，您可以使用 jQuery 的ready()函数

// bind an event handler to the "ready" event on the document
$(document).ready(function () { 
    // ..... here 
});

或速记

$(function () { 
    // ..... here 
});
于 2013-05-10T10:24:45.730 回答