代码之家 › 专栏 › 技术社区 › Mike Fielden

jQuery中的BindAsEventListener等价物?

prototypejs jquery

Mike Fielden · 技术社区 · 16 年前

我正在尝试使用jQuery将单击事件绑定到某个元素。使用prototype我知道我可以使用 BindAsEventListener() .

例子:

var myObject = {

init: function(txtOneId, txtTwoId, lblResultId, ancAddId) {
    this.txtOneId = txtOneId;
    this.txtTwoId = txtTwoId;
    this.lblResultId = lblResultId;
    this.ancAddId = ancAddId;


    var addListener = this.addResult.bindAsEventListener(this);

    Event.observe(this.txtOneId, 'keyup', addListener);
    Event.observe(this.txtTwoId, 'keyup', addListener);
},

addResult: function() {

    var valueOne = $(this.txtOneId).value;
    var valueTwo = $(this.txtTwoId).value;

    if (isNaN(valueOne) || valueOne == "")
        valueOne = 0;
    else
        valueOne = parseInt(valueOne);

    if (isNaN(valueTwo) || valueTwo == "")
        valueTwo = 0;
    else
        valueTwo = parseInt(valueTwo);


    var result = valueOne + valueTwo;

    $(this.lblResultId).innerHTML = result;

    return false;
}};

5 回复 | 直到 13 年前

Hans Cappelle 12 年前

我假设您仍在使用prototype,并且添加了jQuery无冲突,以便 $() 是一个原型方法和是一个jQuery方法。

快速回答

您只需要对init方法进行更改。

    init: function(txtOneId, txtTwoId, lblResultId, ancAddId) {
        this.txtOneId = txtOneId;
        this.txtTwoId = txtTwoId;
        this.lblResultId = lblResultId;
        this.ancAddId = ancAddId;

        var handler = function(event){ event.data.addResult(event) };

        $j(this.txtOneId).bind('keyup', this, handler);
        $j(this.txtTwoId).bind('keyup', this, handler);
    }

解释

对于Prototype,您使用了bindAsEventListener函数,以便在收到事件时可以使用此引用。

对于jQuery,您可以使用以下语法(从 jquery api ):

.bind( eventType [, eventData], handler(eventObject) );

$j(this.txtOneId).bind('keyup', this, function(event){ event.data.addResult(event) });

在本例中,我们将“keyup”事件绑定到文本元素,将this引用作为eventData传递,然后在处理程序函数中使用event.data引用eventData(this)以执行this.addResult(event)方法。

Andrew Revak 14 年前

要在不利用原型函数的情况下实现这一点,可以使用jQuery.proxy

http://api.jquery.com/jQuery.proxy/

cgp 16 年前

Bind documentation.

您需要使用这个示例:在示例中,您在事件处理程序中使用了一个对象。此代码将允许您绑定对象并将其作为事件的一部分取回。这比创建闭包要方便一点。

function Something() {
  this.myData = "fun";
  this.handleClick = function(event) {
    alert(event.data.myData);
  }
}

var something = new Something();
$('h2').bind("click", something, something.handleClick);

matt b 16 年前

click(fn)

$("#someElement").click( function(event) {
     alert("Hi you clicked me!");
});

或者,如果要将“处理程序”定义为命名函数:

function someElementClicked(event) {
     alert("Hi you clicked me!");
};

$("#someElement").click(someElementClicked);

-2

mishac 16 年前

完全等效的是$().bind()函数:

$("#elem").bind('click', function() {
  //do stuff here
});