4

多亏了这个网站上那些人的大力帮助，我一直在慢慢学习 Mojolicious 和 Perl。我一直在尝试根据 Jquery get 调用的结果来确定动态更新部分页面的最佳方法。

目前我有一个这样的模板（感谢 Mojo 的贡献者之一 Joel）

<!DOCTYPE html>
<html>
 <head>
  <title><%= title %></title>
 </head>
 <body>
  %= content
  %= include 'common_js'
  %= content_for 'js_imports'
 </body>  
</html>

然后我有一个使用这种布局的页面，如下所示。

%title 'Script Test'; 
% content_for 'js_imports' => begin 
%= javascript begin 
  $(document).ready(function(){ 
    $("input#testbutton").click(function(){ 
      $.get('<%= url_for('testbutton') %>', 
        function (data) { 
            $("div#content").html(data);  
         }); 
      }) 
   }); 
 % end 
 % end 

<p>Main Page</p> 
<input type="button" id="testbutton" class="btn btn-danger" value="test"> 
<div class="span9" id="content"></div><!--/span9-->

因此，当单击“测试按钮”时，我正在将 get 请求的响应写入带有 id 内容的 div。

我要返回的“数据”是；

% content_for 'js_imports' => begin 
  %= javascript begin 
    $(document).ready(function(){ 
      $("input#testbutton2").click(function(){ 
        alert('testbutton2 clicked'); 
    }); 
    }); 
  % end 
% end    

<p>Test Button Clicked</p> 
<input type="button" id="testbutton2" class="btn btn-danger" value="test2">

现在，我上面的 javascript 没有嵌入到我的页面中。我认为这是因为 content_for js_imports 不再存在于 DOM 中。我可以在我的测试页中添加一个“content_for”标签，然后将脚本添加到我的带有 ID 内容的 DIV 中。我试图以某种方式实现的是将我的脚本添加到我现有脚本下的页面末尾。我知道我可以使用 javascript 添加和删除脚本，但我想知道是否有办法使用标签助手来做到这一点？

4

1 回答 1

2

无需将您返回的数据包含在 content_for 块中。直接包含它：

%= javascript begin 
  $(document).ready(function(){ 
    $("input#testbutton2").click(function(){ 
      alert('testbutton2 clicked'); 
  }); 
  }); 
% end 

<p>Test Button Clicked</p> 
<input type="button" id="testbutton2" class="btn btn-danger" value="test2">

如果您不希望它替换现有内容，而只是附加到它，则使用append而不是html：

$("div#content").append(data);

Joel Berger（在评论中）创造了一个很好的馅饼来展示你想要的东西。

于 2013-03-30T00:29:18.987 回答