0

当用户单击按钮时，我正在尝试加载输入网页的缩略图。缩略图本身在页面上正确生成，但是当我尝试将其加载到 div 元素中时，它会替换整个页面。目前，这只是一个概念证明。如果可以正常工作，我将切换到用户输入的 url。

这是我的点击事件代码：

$('#check_url').click(function() {
    $('#thumb_loader').load('load_thumb.html');
});

thumb_loader 只是一个 div。我也试过这样：

$('#check_url').click(function() {
    $('#thumb_loader').html($('<div>').load('load_thumb.html'));
});

这是load_thumb.html：

<div>
    <script type="text/javascript">
        wsr_snapshot('http://google.com', 'xxxxxxxxxxxxxx', 'Small');
    </script>
</div>

wsr_snashot 是 WebSnapr。图像是在他们的服务器上生成的，并出现在此代码所在的位置。

首先，我什至可以像这样加载 javascript 吗？我以前使用 load 来放入包含 javascript 的内容，所以我怀疑是这种情况。

有人在这里看到任何问题吗？

编辑：

这是我希望加载的 div 所在的表以及用户单击以触发 AJAX 的按钮。

<table>
    <tr>
        <td colspan="2">
                    <div id="thumb_loader"></div>
                </td>
            </tr>
            <tr>
                <td>
                    <label>Link Title:</label>
                </td>
                <td>
                    <label>Link Description:</label>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" name="link_title" />
                </td>
                <td rowspan="3">
                    <textarea name="link_description"></textarea>
                </td>
            </tr>
            <tr>
                <td>
                    <label>Link URL:</label>
                </td>
                <td>

                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" name="link_url" />
                </td>
                <td>

                </td>
            </tr>
            <tr>
                <td>
                    <input id="check_url" type="button" value="Check URL" />
                </td>
                <td align="right">
                    <input type="button" value="Cancel" /><input disabled="disabled" type="submit" value="Add Link" />
                </td>
            </tr>
        </table>

我在代码中看不到任何其他可能相关的内容。希望这已经足够了。

4

2 回答 2

2

将 JS 代码从load_thumb文件中取出并保存在一个新的 js 文件中，image.js并用于$.getScript在您的主页面中动态添加它：

$.getScript('path/image.js', function(){
   // file loaded
});

您应该将上述代码放在要运行拇指图像的主文件中。

更多的：

http://api.jquery.com/jQuery.getScript/

于 2012-06-27T19:49:53.013 回答
1

jQuery#load()：当使用没有后缀选择器表达式的 URL 调用 .load() 时，内容会在脚本被删除之前传递给 .html() 。这会在脚本块被丢弃之前执行它们。但是，如果调用 .load() 时将选择器表达式附加到 URL，则脚本会在 DOM 更新之前被剥离，因此不会执行。

如果wsr_snapshot('http://google.com', 'xxxxxxxxxxxxxx', 'Small');包含任何document.write调用，您的整个文档都会被覆盖。确保您知道该功能的作用。

更新：

根据问题的评论，这确实是问题所在。您需要弄清楚如何wsr_snapshot()以异步方式使用。无论如何，那是什么API？

于 2012-06-27T19:49:51.347 回答