如何使用ujs、jquery和rails加载内容?

我不完全确定我是否理解您的要求,但一般来说,您可以将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”,并只将该部分页面加载到目标容器中。

我最后做了这个,一个依赖于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插件时,我该如何制作它,以便使用 $.modal("<%= escape_javascript(render 'form') %>"); ,没有对象 this 只需调用jquery对象本身的方法?