我在绑定(bind)(或触发)click
事件时遇到问题。
var Edocs = function() {
return {
Utils: function() {
var initHorizontalResizer = function() {
console.log('Edocs.Utils.initHorizontalResizer()');
$('.resize-main-content').on('click', function() {
console.log('abc');
if ($('[id="menu"]').hasClass('slidedOut'))
{
$('[id="menu"]').removeClass('slidedOut');
$('[id="content"]').removeClass('resized');
} else {
$('[id="menu"]').addClass('slidedOut');
$('[id="content"]').addClass('resized');
}
});
};
return {
init: function() {
console.log('Edocs.Utils.init()');
initHorizontalResizer();
}()
};
}()
};
}();
当我打开 javascript 控制台时,我看到以下值:Edocs.Utils.init()
和 Edocs.Utils.initHorizontalResizer()
,但是当我单击 .resize-main-content
元素 - 没有任何反应。所以我尝试将此绑定(bind)直接粘贴到控制台并且... - 它正在工作!为什么?
我正在使用 Primefaces 5.0 (jQuery 1.10.x)
最佳答案
假设.resize-main-content
元素动态附加到页面,则需要使用on
的委托(delegate)版本:
$(document).on('click', '.resize-main-content', function() {
// rest of your code...
});
请注意,应更改 document
以选择在 DOM 加载时可用的 .resize-main-content
最近的父元素。我只是在这里使用 document
作为示例。
关于javascript - jQuery `on` 方法未绑定(bind)事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24953504/