javascript - 在 DOM 加载时触发函数

Question

我有这个小功能：

$('.chrnumberpickerDiv select').change(function(){
    var sel = $(this),
    value = sel.closest('.chrnumberpickerDiv').find('.chrnumberpickerDivText');
    value.text(sel.find(':selected').text());
}).one('change');

我的问题是我还需要在 DOM 加载时触发它。我已经尝试过.trigger('change')，.one('change')但似乎它进入了一个循环并且永远不会停止刷新我的页面。那么我可以做些什么来触发 DOM 上的事件，但又不会对其他事件造成任何损害或使函数进入循环？

Answer 1

如果我理解您的问题，您需要在选择更改时触发一个函数，并在页面加载时以编程方式触发它以填充初始值：

// define the handler
var changeHandler = function() {
    var sel = $(this),
    value = sel.closest('.chrnumberpickerDiv').find('.chrnumberpickerDivText');
    value.text(sel.find(':selected').text());
};

// bind the handler
$('.chrnumberpickerDiv select').change(changeHandler);

$(document).ready(function () {
    // execute the handler on page load
    // use proxy to change what "this" means in the handler
    // (jQuery does this for you when you bind a handler through jQuery)
    $.proxy(changeHandler, $('.chrnumberpickerDiv select')[0]));
});

代理文档

Answer 2

试试这个，而不是你的代码

$(document).ready(function() {
    $('.chrnumberpickerDiv select').change(function(){
        var sel = $(this),
        value = sel.closest('.chrnumberpickerDiv').find('.chrnumberpickerDivText');
        value.text(sel.find(':selected').text());
    }).one('change');
});

您必须注意不要分配多个更改功能。否则，当更改事件发生时，它们都会被调用。