1

我正在尝试找出使用 Rails UJS 将内容插入灯箱的最佳方法。我有一个看起来像这样的链接:

<%= link_to "login", login_path, :remote => true %>

这会产生这样的html:

<a data-remote="true" href="/login">login</a>

所以这一切都很好,我已经创建了视图文件:user_sessions/new.js.erb它也加载得很好,但我的问题是在页面中插入附加 html 的首选方法是什么?就像我在非 js 页面上已经有了登录表单,所以我不能只将部分加载到页面中吗?

任何想法都会受到欢迎。

4

2 回答 2

3

我不完全确定我理解你在问什么,但一般来说,你可以将 HTML 片段填充到一些现有的容器中,如下所示:

$('div#yourDiv').html(blob_of_HTML);

您可以通过以下方式从服务器端操作加载HTML 片段:

$('div#yourDiv').load(yourURL, function() {
  // stuff to do when the content has been loaded
});

如果您有一个完整的页面,并且您只想将其中的一部分加载到另一个页面中,您可以试试这个:

$('div#yourDiv').load(yourUrl + ' #something', function() {
  // stuff to do ...
});

这告诉 jQuery 获取加载的整个页面内容,然后在整个页面中查找“#something”,并且只将页面的该部分加载到目标容器中。

于 2010-06-12T23:19:13.433 回答
1

我最终这样做了,这是一个依赖于 ujs 的 jQuery 插件:

这在我的user_sessions/new.js.erb

$(this).modal("<%= escape_javascript(render 'form') %>");

然后我制作了一个jQuery插件:

jQuery.fn.modal = function(content) {
  var modal_screen = $(document.createElement('div')).addClass("modal_screen");

  var modal_container = $(document.createElement('div')).addClass("modal_container");
  var modal_outer_border = $(document.createElement('div')).addClass("modal_outer_border").appendTo(modal_container);
  var modal_inner_border = $(document.createElement('div')).addClass("modal_inner_border").appendTo(modal_outer_border);
  var modal_contents = $(document.createElement('div')).addClass("modal_contents").appendTo(modal_inner_border);

  $(modal_screen).appendTo('body');
  $(modal_container).appendTo('body');
  $(modal_contents).append(content);
}

是的,我知道有很多容器,但我必须这样做才能使模态窗口垂直居中并提供一个很好的双边框情况。

让我知道你对这些人的看法!


也许另一个问题是在制作 jQuery 插件时如何制作它,以便我可以使用 just 调用插件$.modal("<%= escape_javascript(render 'form') %>");,而不使用对象this,并且只调用 jQuery 对象本身的方法?

于 2010-06-12T23:33:45.193 回答