我试图理解使用jQuery .on()方法的直接和委托事件处理程序之间的这种特殊区别.具体而言,本段最后一句:
当
selector被提供时,事件处理程序被称为委托.当事件直接发生在绑定元素上时,不会调用处理程序,但仅适用于与选择器匹配的后代(内部元素).jQuery将事件从事件目标起泡到附加处理程序的元素(即最里面到最外层的元素),并为匹配选择器的路径上的任何元素运行处理程序.
"运行任何元素的处理程序"是什么意思?我做了一个测试页面来试验这个概念.但是以下两个结构导致了相同的行为:
$("div#target span.green").on("click", function() {
alert($(this).attr("class") + " is clicked");
});
Run Code Online (Sandbox Code Playgroud)
要么,
$("div#target").on("click", "span.green", function() {
alert($(this).attr("class") + " is clicked");
});
Run Code Online (Sandbox Code Playgroud)
也许有人可以参考一个不同的例子来澄清这一点?谢谢.
javascript jquery event-bubbling event-binding jquery-events
我想在一个敲除的观察点上执行一个事件input.当控件失去焦点时,即使没有输入任何内容,也应执行此功能.我尝试更改事件绑定但是当用户离开控件而不键入任何内容时它不会触发.我尝试过mouseout事件,但只有当用户在失去焦点后点击表单中的其他地方时才会触发 - 这不是我想要的.即使使用制表符,我也希望一旦焦点从控件移开,偶数就会闪光.
以下是我用于mouseout事件的代码:
<input
type="text"
id="txtFirstName"
tabindex="1"
maxlength="25"
class="txtbox"
style="width: 200px;"
data-bind="value: FirstName,
attr: {title: FirstNameErrorMessage },
css: {validationFailed: !IsValidFirstName() },
event: {mouseout: ValidateFirstName}"
/>
this.ValidateFirstName = function () {
self.IsValidFirstName(true);
self.FirstNameErrorMessage('');
if (self.FirstName() == '') {
self.IsValidFirstName(false);
self.FirstNameErrorMessage('First Name is required');
}
}
Run Code Online (Sandbox Code Playgroud)
有人可以帮忙吗?
如何在Angular 2中的渲染元素中绑定事件侦听器?
我正在使用Dragula拖放库.它创建动态HTML但我的事件不绑定到动态HTML元素.
假设整个站点中存在大量元素,这些元素具有未知数量和绑定到它们的事件类型.
如果我需要使用一个绑定事件覆盖所有这些事件,并且只触发该事件,那么有哪些建议?
我将事件绑定到click事件处理程序,我正在使用jQuery.
提前致谢.
我正在遵循WPF UI 的MV-VM模式.我想将一个命令连接到TextBox的TextChanged事件到我的ViewModel类中的命令.我可以设想完成此任务的唯一方法是继承TextBox控件,并实现ICommandSource.然后,我可以指示从TextChanged事件触发该命令.对于看起来如此简单的事情来说,这似乎太过分了.
是否有一种更简单的方法(比继承TextBox和实现ICommandSource)将TextChanged事件连接到我的ViewModel类?
我看到了在JavaScript中设置事件的两种主要方法:
直接在标记内添加事件,如下所示:
<a href="" onclick="doFoo()">do foo</a>
通过JavaScript设置它们,如下所示:
<a id="bar" href="">do bar</a>
并在该<script>部分内部<head>或外部JavaScript文件中添加一个事件,如果您正在使用prototypeJS:
Event.observe(window, 'load', function() {
$('bar').observe('click', doBar);
}
Run Code Online (Sandbox Code Playgroud)
我认为第一种方法更容易阅读和维护(因为JavaScript操作直接绑定到链接)但它不是那么干净(因为即使页面没有完全加载,用户也可以点击链接,这可能会导致JavaScript错误在某些情况下).
第二种方法更清晰(在页面完全加载时添加操作)但是更难以知道操作链接到标记.
哪种方法最好?
一个杀手的答案将完全赞赏!
Backbone.js中的bind()和on()方法有什么区别
on()的文档:关于backbone.js的方法文档
bind()的文档:在underscore.js中绑定方法文档
应该使用哪两个来绑定对象的自定义事件?
用法示例:
this.bind('myEvent', this.render, this);
this.on('myEvent', this.render, this);
Run Code Online (Sandbox Code Playgroud) 我正在使用 jQuery 的模式对话框来打开包含表单的对话框。我无法解决的是如何将事件绑定到添加到我的模式对话框中的组件。在本例中,我想将单击或更改绑定到已位于对话框中的复选框。加载对话框时似乎没有触发任何成功方法。我就是这样做的:
我在 javascript 的开头、ready-function 的开头执行此操作:
$( "#dialog:ui-dialog" ).dialog( "destroy" );
$( "#dialog-modal" ).dialog({
autoOpen: false,
show: "blind",
hide: "explode",
minWidth: 400,
modal: true
});
Run Code Online (Sandbox Code Playgroud)
稍后,我在单击按钮时执行此操作:
$('#dialog-modal').dialog( "option", "title", lang.localized_text.ADD_AGENT);
$('#dialog-modal').live('dialogopen', function(msg){
alert("Opens");
$("#select_all").live('click', function(msg){
alert("clicked");
});
});
$.get("https://" + hostname + "/modules/core/useradmin/adminactivities/admin_add_agent.php",function(e){
var obj = $.parseJSON(e);
$("#dialog-modal").html(obj.html);
$("#dialog-modal").dialog("open");
addAddAgentValidation();
}
});
Run Code Online (Sandbox Code Playgroud)
可以清楚地看到在打开对话框之前出现了alert(“Opens”)。因此,dialogopen 在对话框完成加载之前被触发。但是验证处理程序(调用绑定验证检查的验证函数)可以工作。
警报(“点击”);永远不会被触发。
如何将任何事件绑定到模式对话框上的组件?对话框创建后是否有回调函数?
例如,如果我有一个绑定了以下事件的链接:
$("a.d").bind("click", this, onDelete);
Run Code Online (Sandbox Code Playgroud)
后来做:
$("a.d").remove();
Run Code Online (Sandbox Code Playgroud)
那很好吗?或者它是否会导致内存泄漏,我需要调用unbind 1st?
谢谢你的帮助.
event-binding ×10
javascript ×5
jquery ×4
events ×2
html ×2
angular ×1
backbone.js ×1
bind ×1
command ×1
knockout.js ×1
modal-dialog ×1
mouseout ×1
mvvm ×1
python ×1
tkinter ×1
wpf ×1