0

如何在从 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>
4

2 回答 2

0

我假设 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);
于 2013-10-19T20:46:14.700 回答
0

对不起，但我不能做编辑。

* 这就是 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");
于 2013-10-22T18:32:36.623 回答