Question

如何在ajax返回的数据上运行asd.js脚本？

HTML

<script type="text/javascript" src="asd.js"></script>
<div class="one">
    <ul id="qwe"></ul>

</div>

的JavaScript

$(document).ready(function () {
    $('#search').click(function () {
            $.ajax({
                type: "POST",
                url: 'abc.php',
                data: {cid: cid},

                success: function (data) {
                 $("#qwe").html(data);
                }
            });

    });
});

成功ajax返回的数据是：

<li> <a href="images3.jpg"><img src="images/a4.jpg"/>
         <span>
          <div class="title"><img src="Images/a5.jpg"/></div>
         </span>
      </a>
</li>

Answer 1

我假设asd.js添加了一些事件挂钩或者你需要再次应用于HTML元素的东西已经从你的AJAX调用中回来了。所以 - 在函数中包装asd.js的内容，在asd.js结束时调用该函数一次，然后在设置$（'＃qwe'）。html（data）后再次调用该函数。

如果要添加事件挂钩或以其他方式使用DOM，则应从$（document）.ready（...）函数调用asd.js中的初始化函数（否则您有潜在的竞争条件继续在这里。）

如果你不能改变asd.js，事情就会变得更加艰难。确定哪些功能很重要并调用它们。在最糟糕的情况下，您可以尝试动态删除并添加脚本标记以使其重新运行（但这太可怕了）。

编辑：好的，我想更清楚地说明这一点。我假设asd.js只是一个在加载脚本后立即执行的操作列表，例如

// asd.js: wiring up a bunch of events 
document.getElementById('...').onclick = function() { doSomething(); };

如果是这种情况，你可以将它包装在这样的函数中：

// asd.js: wiring up a bunch of events 
function init()
{
  document.getElementById('...').onclick = function() { doSomething(); };
}

init();

然后还从响应处理程序中调用init（）：

success: function (data) {
           $("#qwe").html(data);
           init();
         }

从您的评论中看来，asd.js看起来可能更像这样：

// asd.js: wiring up a bunch of events 
jQuery(function() {
  document.getElementById('...').onclick = function() { doSomething(); };
});

如果是这种情况，你会做这样的事情：

// asd.js: wiring up a bunch of events 
jQuery(function() { init(); });

function init()
{
  document.getElementById('...').onclick = function() { doSomething(); };
}

可以缩短jQuery行：

jQuery(init);

Answer 2

抱歉，但我无法进行编辑。

*这就是asd.js cotain（如果有帮助）：*

var yoxviewPath = getYoxviewPath();
var cssLink = top.document.createElement("link");
cssLink.setAttribute("rel", "Stylesheet");
cssLink.setAttribute("type", "text/css");
cssLink.setAttribute("href", yoxviewPath + "yoxview.css");
top.document.getElementsByTagName("head")[0].appendChild(cssLink);

function LoadScript(url)
{
    document.write( '<scr' + 'ipt type="text/javascript" src="' + url + '"><\/scr' + 'ipt>' ) ;
}

var jQueryIsLoaded = typeof jQuery != "undefined";

if (!jQueryIsLoaded)
    LoadScript("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js");

LoadScript(yoxviewPath + "jquery.yoxview-2.2.min.js");

function getYoxviewPath()
{
    var scripts = document.getElementsByTagName("script");
    var regex = /(.*\/)yoxview-init/i;
    for(var i=0; i<scripts.length; i++)
    {
        var currentScriptSrc = scripts[i].src;
        if (currentScriptSrc.match(regex))
            return currentScriptSrc.match(regex)[1];
    }

    return null;
}
// Remove the next line's comment to apply yoxview without knowing jQuery to all containers with class 'yoxview':
LoadScript(yoxviewPath + "yoxview-nojquery.js");

在ajax加载后执行javascript文件

2 个答案: