jQuery的绑定submit事件 - 找到来电者 [英] jquery bind submit event - find caller
问题描述
如何将能够找出事件的来电/发件人的结合。
How would I be able to find out the caller/sender of an event on binding.
$(this).bind("submit", function(caller) { ... });
我发现我可以用caller.originalEvent.explicitOriginalTarget，但在Firefox这只是工作。
I found out that I could use "caller.originalEvent.explicitOriginalTarget", but this only works in firefox.
编辑：
我使用jQuery验证库从position-relative.net我想使它所以，如果一个按钮有一个叫发件人搭桥级，这使得验证引擎只返回true，所以此表可提交。即我使用ASP.NET，所有按钮presses是回传（表单提交）。我只是想制造一个后退按钮。
I'm using the jquery validation library from position-relative.net I want to make it so that if a button has a class called "bypass" on the sender, that makes the validation engine just return true so the form can be submitted. I.e. I'm using ASP.NET, and all button presses are postbacks (form submits). I'm just looking to make a back button.
我添加了这code
if ((caller.originalEvent.explicitOriginalTarget != null) && (caller.originalEvent.explicitOriginalTarget.className == "bypass")) {
return true;
}
在线71，略低于该行
on line 71, just under this line
$(this).bind("submit", function(caller) { // ON FORM SUBMIT, CONTROL AJAX FUNCTION IF SPECIFIED ON DOCUMENT READY
的想法和建议AP preciated。
Thoughts and suggestions appreciated.
感谢
推荐答案
更新：每下方的评论，你希望看到的这的提交按钮触发提交。你不能做到这一点与形式的提交事件＆NBSP;＆MDASH;但你可以在点击事件上的提交按钮：
Update: Per your comment below, you're looking to see which submit button triggered the submission. You can't do that with the form's submit event — but you can with the click event on your submit buttons:
$(this).find("input[type=submit]").click(function() {
var bypass = $(this).hasClass("bypass");
});
提交按钮的点击表单的提交事件之前，事件发生，所以你可以用它来设置一个标志，然后使用该标志在表单的提交处理程序。该标志可以是在JavaScript中code某处，表单上的隐藏字段，您添加到窗体元素的属性，等等。
The submit button's click event happens before the form's submit event, so you can use that to set a flag, and then use that flag in the form's submit handler. The flag can be in JavaScript code somewhere, a hidden field on the form, an attribute you add to the form element, etc.
关于目标以下信息与这个可能不再是你的问题直接相关的，但我要离开它，因为谁需要了解的人目标与这个可能会发现你的问题，所以它可能是有用的到他们。
The following information about target vs. this is probably no longer directly relevant to your question, but I'm leaving it because people who need to understand target vs. this will probably find your question, so it may be useful to them.
event.target 是实际发生事件的元素。对于冒泡事件，这可能是对你已经附加处理程序元素的后代：
event.target is the element on which the event actually occurred. For bubbling events, this may be a descendant of the element on which you've attached a handler:
$(this).bind("submit", function(event) {
var target = event.target;
});
这个 在您设定的事件处理程序的元素（这是的jQuery 保证）：
$(this).bind("submit", function(event) {
// `this` is the element you hooked the event on
});
由于您使用的是提交事件，并直接挂钩的形式，我期望目标和这个是相同的。
Since you're using a submit event and hooking the form directly, I'd expect target and this to be the same.
三个例子（二关于形式，一种只是一般的）
Three examples (two regarding forms, one just general)
1.A。以实例的形式提交和JavaScript变量（真人版）：
下面是一个使用表单提交的例子，区分目标和这个，并显示挂接的提交按钮点击事件，所以我们知道他们是否有类搭桥。这将使用国旗在JavaScript的code：
Here's an example that uses form submit, differentiates between target and this, and shows hooking up the submit buttons' click events so we know whether they have the class "bypass". This uses a flag in the JavaScript code:
<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<meta charset=utf-8 />
<title>Target Example</title>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
body {
font-family: sans-serif;
}
</style>
</head>
<body>
<form id='theForm' action='#'>
<input type='submit' value='Send 1' class='bypass'>
<input type='submit' value='Send 2'>
</form>
<hr>
</body>
<script type='text/javascript'>
jQuery(function($) {
var form, bypass;
// Our bypass flag
bypass = false;
// Get the form
form = $('#theForm');
// Hook up click handlers on the submit buttons
// to update the bypass flag.
form.find('input[type=submit]').click(function() {
bypass = $(this).hasClass('bypass');
});
// Hook up a form submission handler
form.submit(function(event) {
// Either do validation or don't, as appropriate
display("event.target.tagName = " + event.target.tagName +
", this.tagName = " + this.tagName +
", bypass = " + bypass);
// Best to reset the flag here in case submission is
// cancelled and then the form is re-submitted using
// something other than a submit button (the user
// pressing Enter in a text field, or you calling the
// submit function)
bypass = false;
// Just returning false in this example
return false;
});
function display(msg) {
$("<p>" + msg + "</p>").appendTo(document.body);
}
});
</script>
</html>
1.B。以实例的形式提交和属性（真人版）：
这是相同的例子如以上所述，但使用的属性，而不是在JavaScript中code进行标志：
This is the same example as the above, but using an attribute instead of a flag in the JavaScript code:
<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<meta charset=utf-8 />
<title>Target Example</title>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
body {
font-family: sans-serif;
}
</style>
</head>
<body>
<form id='theForm' action='#'>
<input type='submit' value='Send 1' class='bypass'>
<input type='submit' value='Send 2'>
</form>
<hr>
</body>
<script type='text/javascript'>
jQuery(function($) {
var form;
// Get the form
form = $('#theForm');
// Default to no bypass
form.attr("data-bypass", "N");
// Hook up click handlers on the submit buttons
// to update the bypass flag.
form.find('input[type=submit]').click(function() {
$(this.form).attr("bypass",
$(this).hasClass('bypass') ? "Y" : "N");
});
// Hook up a form submission handler
form.submit(function(event) {
var form = $(this);
// Either do validation or don't, as appropriate
display("event.target.tagName = " + event.target.tagName +
", this.tagName = " + this.tagName +
", bypass = " + form.attr("bypass"));
// Best to reset the flag here in case submission is
// cancelled and then the form is re-submitted using
// something other than a submit button (the user
// pressing Enter in a text field, or you calling the
// submit function)
form.attr("bypass", "N");
// Just returning false in this example
return false;
});
// We're done with the `form` jQuery obj, release it
form = undefined;
function display(msg) {
$("<p>" + msg + "</p>").appendTo(document.body);
}
});
</script>
</html>
2。例如使用目标和这个 （真人版）：
这例子已经不再是你的问题相关，但我把它留在地方，任何人都需要的目标与这样的例子。
This example is no longer relevant to your question, but I'm leaving it in place for anyone needing an example of target vs. this.
<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<meta charset=utf-8 />
<title>Target Example</title>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
body {
font-family: sans-serif;
}
</style>
</head>
<body>
<p id="one">I'm one, and <strong>this is a child element</strong></p>
<p id="two">I'm two, and <strong><em>this is two children deep</em></strong></p>
<p id="three">I'm three, there are no child elements here</p>
<hr>
</body>
<script type='text/javascript'>
jQuery(function($) {
$('p').click(function(event) {
display("event.target.tagName = " + event.target.tagName +
", this.tagName = " + this.tagName);
});
function display(msg) {
$("<p>" + msg + "</p>").appendTo(document.body);
}
});
</script>
</html>
这篇关于jQuery的绑定submit事件 - 找到来电者的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
