如何将DOM对象的引用传递给jQuery函数？

Question

我想将DOM对象的引用传递给jQuery函数.但是,该函数不会获得对DOM对象的引用.它确实得到一个包含DOM对象的字符串.所以我在下面的例子中得到一个错误

<input type="text" size="30" onchange="change_total_price(this)" id="priceField">

.

function change_total_price(input) {
    input.closest('div').find('#amountField').val());
}

Answer 1

你需要包装它,像这样:

function change_total_price(input) {
  var val = $(input).closest('div').find('#amountField').val();
}

this,input在函数中是一个DOM元素,但是.closest()是一个jQuery对象方法,因此$()如果要使用它,需要将其包装起来以获取jQuery对象.

或者在标记之外执行此操作,如下所示:

$(function() {
  $("#priceField").change(function() {
    var val = $(this).closest('div').find('#amountField').val();
  });
});

这种方式将change事件处理程序绑定到id="preiceField"元素,您可以删除内联onchange="change_total_price(this)"...它更清晰,更易于维护(例如,可以在外部.js加载和缓存一次的页面之外).

另外,ID应该是唯一的,因此它根本不需要是相对的,以上两个示例都可以是:

var val = $('#amountField').val();