jquery页面javascript未在ajax div上加载

Question

[REVISED] [修订]

Hi, thanks for the feedback guys.你好，感谢反馈的家伙。 I revised by question btw.顺便说一句，我通过问题进行了修改。 To make things clearer here's my html page (sample only)为了让事情更清楚，这是我的 html 页面（仅示例）

<html>
<head>
<body>
     <form>
     <div class="loadAjax"></div>
     <div class="toggle">[form inputs here]</toggle>
     <a href="#" class="btn">Submit</a>
     </form>
     <script>[several js scripts here]</script>
</body>
</html>

And here's my main js file:这是我的主要 js 文件：

$(function() {
     [some lines here]
     $('.toggle').toggle();
     $('.btn').on('click', function(e) {
          e.preventDefault();
          $.ajax({
               url: 'http://example.com/ajaxpage',
               type: 'POST',
               data: $('form').serialize(),
               beforeSend: function() {
                     ...
               },
               success: function(data) {
                     $.getScript('js/main.js');
                     $('.content').html(data);
               }
          });
     });
});

The page that will be loaded in div.loadAjax.将在 div.loadAjax 中加载的页面。

<div class="toggle">ajax page load</div>

Taking this as an example, the toggle on the main page seems to work.以此为例，主页上的切换似乎有效。 But the div.toggle on the div.loadAjax doesn't.但是div.toggle上的div.loadAjax没有。 I need to set the $.getScipt() in order to reload the main.js file again.我需要设置$.getScipt()以便再次重新加载 main.js 文件。 Shouldn't the div.loadAjax inherit the main.js since it is loaded already in the first place? div.loadAjax不应该继承 main.js，因为它首先已经加载了吗？ Why do I still need to reload it again using the $.getScript() ?为什么我仍然需要使用$.getScript()重新加载它？

NOTE: I'm using ajax to do a form post on a PHP page.注意：我正在使用 ajax 在 PHP 页面上发布表单。

Thanks again!再次感谢！

Answer 1

The code for toggle was already executed on your first page load.切换代码已在您的第一个页面加载时执行。 That will not execute again automatically without a page reload, otherwise you have to trigger it again or should load your script again as you did now.这不会在没有页面重新加载的情况下自动再次执行，否则您必须再次触发它或者应该像现在一样再次加载您的脚本。

Try attaching it to click event and trigger it dynamically using .trigger尝试将其附加到 click 事件并使用.trigger动态触发它

$(function() {
     [some lines here]

     $(".toggle").on("click", function(){
                           $('.toggle').toggle();
                             });

    $('.toggle').trigger("click");

     $('.btn').on('click', function(e) {
          e.preventDefault();
          $.ajax({
               url: 'http://example.com/ajaxpage',
               type: 'POST',
               data: $('form').serialize(),
               beforeSend: function() {
                     ...
               },
               success: function(data) {

                     $('.content').html(data);
                     $('.toggle').trigger("click");
               }
          });
     });
});

Answer 2

Why don't you use the $.load() method: http://api.jquery.com/load/为什么不使用$.load()方法： http : //api.jquery.com/load/

This will let you perform an Ajax call, inject the results back onto the DOM of your page and also supports executing scripts loaded via the request.这将允许您执行 Ajax 调用，将结果注入回页面的 DOM 中，并且还支持执行通过请求加载的脚本。

jquery页面javascript未在ajax div上加载

问题描述

2 个解决方案

解决方案1
1 已采纳 2013-12-24 09:26:23

解决方案2
0 2013-12-23 14:05:20

jquery页面javascript未在ajax div上加载

问题描述

2 个解决方案

解决方案1 1 已采纳 2013-12-24 09:26:23

解决方案2 0 2013-12-23 14:05:20

解决方案1
1 已采纳 2013-12-24 09:26:23

解决方案2
0 2013-12-23 14:05:20