我使用Rails和jQuery,通过单击链接进行ajax调用。我将我的application.js文件设置为与建议的这里文件类似的文件,它工作得很好。我遇到的问题是如何在我的话中使用$(这个)。update.js.erb文件来表示我单击的链接?我不想给每个人分配一个ID,然后在回调脚本中重新编译这个id。
编辑,给出一个类似于我试图做的事情的简单示例(并且更容易解释):如果用户单击链接,从列表中删除该元素,控制器将处理回调,回调(这里有问题)将删除我单击的元素,因此回调delete.js.erb只需使用$( This ).fadeOut();这就是为什么我希望使用$(this),这样我就不必为每个元素分配ID (这将是世界末日,只是更详细的标记)。
application.js
jQuery.ajaxSetup({ 'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript,application/javascript,text/html")} })
function _ajax_request(url, data, callback, type, method) {
if (jQuery.isFunction(data)) {
callback = data;
data = {};
}
return jQuery.ajax({
type: method,
url: url,
data: data,
success: callback,
dataType: type
});
}
jQuery.extend({
put: function(url, data, callback, type) {
return _ajax_request(url, data, callback, type, 'PUT');
},
delete_: function(url, data, callback, type) {
return _ajax_request(url, data, callback, type, 'DELETE');
}
});
jQuery.fn.submitWithAjax = function() {
this.unbind('submit', false);
this.submit(function() {
$.post(this.action, $(this).serialize(), null, "script");
return false;
})
return this;
};
// Send data via get if <acronym title="JavaScript">JS</acronym> enabled
jQuery.fn.getWithAjax = function() {
this.unbind('click', false);
this.click(function() {
$.get($(this).attr("href"), $(this).serialize(), null, "script");
return false;
})
return this;
};
// Send data via Post if <acronym title="JavaScript">JS</acronym> enabled
jQuery.fn.postWithAjax = function() {
this.unbind('click', false);
this.click(function() {
$.post($(this).attr("href"), $(this).serialize(), null, "script");
return false;
})
return this;
};
jQuery.fn.putWithAjax = function() {
this.unbind('click', false);
this.click(function() {
$.put($(this).attr("href"), $(this).serialize(), null, "script");
return false;
})
return this;
};
jQuery.fn.deleteWithAjax = function() {
this.removeAttr('onclick');
this.unbind('click', false);
this.click(function() {
$.delete_($(this).attr("href"), $(this).serialize(), null, "script");
return false;
})
return this;
};
// This will "ajaxify" the links
function ajaxLinks(){
$('.ajaxForm').submitWithAjax();
$('a.get').getWithAjax();
$('a.post').postWithAjax();
$('a.put').putWithAjax();
$('a.delete').deleteWithAjax();
}
show.html.erb
<%= link_to 'Link Title', article_path(a, :sentiment => Article::Sentiment['Neutral']), :class => 'put' %>
这两件事的组合将在rails中调用update.js.erb,该文件中的代码将用作ajax的回调(在本例中为$.put)。
update.js.erb
// user feedback
$("#notice").html('<%= flash[:notice] %>');
// update the background color
$(this OR e.target).attr("color", "red");
发布于 2010-04-21 15:40:50
这是不可能实现的,我试图这样做的方法使得不可能,我不能通过视图传递对javascript对象的引用。
解决方案是为每个项目分配ID,并按此引用它们。
发布于 2010-02-19 03:44:16
jQuery已经用事件属性为您处理了this
问题:
$("a").click(function(e){
e.preventDefault();
$("#foo").fadeIn(3000, function(){
$(e.target).text("Foo loaded");
});
});
请注意,我如何通过它的event
返回主链接。在内部处理的任何事件都是这样的。只需给它们一个独特的名称,如e2
、e3
等。不再需要不断地编写另一条var item = $(this)
行来跟踪this
三个事件。
在线演示:http://jsbin.com/egelu3/edit
发布于 2010-02-04 07:12:09
如果您的JS来自服务器,那么$(this)就不可能在相同的上下文中运行。您能得到的最接近的方法是从服务器加载一些脚本,并在客户端函数的上下文中对其进行评估。
基本上,我对需要操作的每个DOM元素都有一个id,并在脚本中引用它们。它偶尔是丑陋的,但另一个选择则更糟糕。
https://stackoverflow.com/questions/2197685
复制相似问题