Javascript 将变量传递给匿名函数
这是我需要学习一段时间的东西,我想知道是否有javascript专家可以为我指出正确的方向 我使用过的许多库似乎都接受函数指针作为参数,例如成功挂钩、失败挂钩等。下面是我正在开发的应用程序中的一个简单示例:Javascript 将变量传递给匿名函数,javascript,jquery,Javascript,Jquery,这是我需要学习一段时间的东西,我想知道是否有javascript专家可以为我指出正确的方向 我使用过的许多库似乎都接受函数指针作为参数,例如成功挂钩、失败挂钩等。下面是我正在开发的应用程序中的一个简单示例: $('.clock-btn').each(function(){ $(this).click(function(){ $.ajax( { url:'punch.php?task_id=' + $(this).data('task-id'),
$('.clock-btn').each(function(){
$(this).click(function(){
$.ajax(
{
url:'punch.php?task_id=' + $(this).data('task-id'),
success: function() {
reverseCSS($(this));
},
error: function() {
window.alert("Clocking time to this project is not allowed.");
}
}
);
});
}))
其中,reverseCSS()
函数是一个将按钮更改为动画的函数,并根据以前的情况与“clock in/clock out”交换单词
但是,我无法在$.ajax
调用中访问$(this)变量。这是我所期望的行为,正如我在本例中所知道的,$(This)
将是$.ajax对象,而不是我从html中需要的项
那么,访问$(this)
项的最佳方法是什么
非常感谢您的帮助。这就是bind()
函数的作用:
$('.clock-btn').each(function(){
$(this).click(function(){
$.ajax(
{
url:'punch.php?task_id=' + $(this).data('task-id'),
success: function() {
reverseCSS($(this));
}.bind(this)
}
);
});
它只返回一个函数,该函数总是在您给定的上下文中运行,在这种情况下,上下文是this
这就是bind()
函数所做的:
$('.clock-btn').each(function(){
$(this).click(function(){
$.ajax(
{
url:'punch.php?task_id=' + $(this).data('task-id'),
success: function() {
reverseCSS($(this));
}.bind(this)
}
);
});
$('.clock-btn').each(function(){
$(this).click(function(){
var that = this; // save it to another variable
$.ajax({
url:'punch.php?task_id=' + $(this).data('task-id'),
success: function() {
reverseCSS($(that));
},
error: function() {
window.alert("Clocking time to this project is not allowed.");
}
});
});
});
它只返回一个函数,该函数总是在您给定的上下文中运行,在这种情况下,上下文是this
以下内容:
$('.clock-btn').each(function(){
$(this).click(function(){
var that = this; // save it to another variable
$.ajax({
url:'punch.php?task_id=' + $(this).data('task-id'),
success: function() {
reverseCSS($(that));
},
error: function() {
window.alert("Clocking time to this project is not allowed.");
}
});
});
});
$(this).click(function() {
var $self = $(this);
$.ajax({
url:'punch.php?task_id=' + $(this).data('task-id'),
success: function() {
reverseCSS($self);
},
// ...
大致如下:
$(this).click(function() {
var $self = $(this);
$.ajax({
url:'punch.php?task_id=' + $(this).data('task-id'),
success: function() {
reverseCSS($self);
},
// ...
在ajax调用之前添加一个变量:var mythis=$(此)并将mythis传递给function顺便说一句,您仍然可以通过使用$('.clock btn')将双关闭替换为单关闭来优化代码。单击(function()…
在ajax调用之前添加一个变量:var mythis=$(此)顺便说一句,您仍然可以通过使用$('.clock btn')将双关闭替换为单关闭来优化代码。单击(function()..
这应该是正确的答案。啊,绑定方法!我在很多地方看到过,但从来没有花时间去阅读更多关于它的内容。非常感谢!欢迎您,在ES6中,使用所谓的箭头函数甚至会更容易,请看例如,这里的绑定方法与一些旧浏览器不兼容。尽管您正在谈论关于没有人支持的古代浏览器,您可以始终使用polyfill,例如,请看这里,这应该是正确的答案。啊,bind方法!我在一些地方看到过这一点,但从未花力气阅读过更多有关它的内容。非常感谢!欢迎您,在ES6中,使用所谓的箭头函数甚至会更容易,请看这里的bind方法和一些旧的浏览器不兼容。虽然你们谈论的是并没有人支持的古老浏览器,但你们可以使用polyfill,例如,看这里这是一个有用的答案,我可能应该说我正在尝试找出如何在不创建临时变量的情况下访问它。希望这对其他人有所帮助,though!这是一个有用的答案,我可能应该说,我正在尝试找出如何在不创建临时变量的情况下访问它。不过,希望这对其他人有所帮助!一个有用的答案。谢谢。一个有用的答案。谢谢。