0

我有一个带有 AJAX 实时搜索的 index.php 页面的网站，该页面与数据库连接并返回结果。这些结果之一是：

<div id="searchlinktovideo">Video</div>

我在 index.php 页面中也有代码尝试使用上面的代码做一些事情，在这种情况下，当用户点击它时，动画到一个页面：

$(document).ready(function () {
$("#searchlinktovideo").click(function () {
    $("#searchpage").animate({
        'left': '-486px'
    }, 200, function () {
        $("#homepage").animate({
            'left': '-486px'
        }, 200, function () {
            $("#videopage").animate({
                'left': '0px'
            }, 200);
        });
    });
});
});

它不起作用，我认为它可能与 Html DOM 相关，但我不知道从哪里开始解决问题。

现在您可以在http://www.squbo.com找到代码（单击搜索并输入“视频” - 结果显示为 HTML，但 JQUERY 无法在其上运行））

4

2 回答 2

1

如果<div id="searchlinktovideo">Video</div>是动态添加的（听起来像是），那么您的问题可能是您尝试在项目实际在页面中之前安装事件处理程序。这最终什么都不做，因为找不到该项目，因此没有安装事件处理程序。

有几个可能的解决方案。

  1. 您可以使用与动态添加的元素一起使用的委托事件处理。
  2. 您可以在将项目添加到页面后安装事件处理程序。

对于委托事件处理，您可以使用：

$(document).on("click", "#searchlinktovideo", function () {...});

理想情况下，$(document)您应该使用选择器来选择更接近#searchlinktovideo.

于 2013-11-10T19:19:50.390 回答
0

您会看到 jquerysearchlinktovideo在页面准备好后立即查找，但 ajax 请求在页面准备好后完成，因此当它搜索它时，它什么也没找到。你需要使用

$( document ).ajaxComplete(function() {
 $("#searchlinktovideo").click(function () {
 ..
 ..
 ..
 });

});
于 2013-11-10T19:26:24.373 回答