3

我是编码的初学者，我从 Codecademy.com 学到了关于 Jquery 和 Javascript 的大部分知识


我想做什么（之前有一点背景）：

  1. 将鼠标悬停在特定链接（部分网址）上
  2. 获取完整的链接内容（完整的 url）
  3. 解析链接的 HTML 内容
  4. 将解析后的数据显示为“div”以显示带有数据的“弹出窗口”

所以我使用Jquery 将鼠标悬停在特定链接上，这样第1 步就完成了。我被困在第 2 步。

这是我的代码：

$(document).ready(function () {
    var link_account = $("a[href^='http://www.example.com/info.php?ID=']");
    link_account.mouseenter(function () {
        var data2 = $(this).get({dataType: "html"});
        $(this).after(data2);
    });
});

我试图在代码中做的事情：

  1. 等待文件加载（成功）
  2. 找到我要使用的部分链接（成功）
  3. 当我的鼠标悬停在它上面时会启动一个事件（成功）
  4. 从链接中提取 HTML（失败）

    重要提示：我想在从链接访问 URL 后提取 HTML 页面的 HTML 内容。（如果不清楚，我很抱歉）

  5. 在链接后添加 HTML 代码作为字符串，该链接应该与其他实例一起工作（成功）

正如您在此处看到的，我尝试使用 $.get 函数来接收所有 HTML 内容。但我想我不太正确理解这个概念。在尝试从其他地方拉取它之前，我什至尝试通过 URL 对其进行测试，但这并没有帮助。我在这里不知所措。

**请注意，当我尝试使用以下方式切换$(this).after(data2);时：

$(this).after("<p>" + $(this).get() + "</p>");

我可以看到链接的完整 URL，而不是 HTML 内容。

我看到还有 $.ajax 但我不确定在这种情况下应该使用哪一个。

一些指导将不胜感激！

4

2 回答 2

4

You are not using the AJAX $.get(), but instead this .get() which is entirely different. That's why you are not getting the HTML from those links.

//step 1: Run on DOM ready
$(function() {

  //step 2 & 3: Get all links you want and add event handler
  $("a[href^='http://www.example.com/info.php?ID=']").on('mouseover',function(){

    //let's reference this link since the context will change in the get callback
    var link = this;

    //step 4: Use the href and get the HTML of that link
    $.get($(this).attr('href'),function(html){

      //step 5: Put the returned html after your link
      $(link).after(html);
    });
  });
});

Of course, Same-Origin rules apply to AJAX. There's a lot of ways you can bypass it, just use the search. There are a lot of questions about it here. And don't forget to use the console of the browser. It tells you a lot about the errors that happen.

于 2013-05-17T10:21:12.150 回答
1

I suggest you use this method: http://api.jquery.com/attr/ to retrieve the value of href.

so 

url = $(this).attr("href");

or if it is the content you want:

html = $(this).html();

If you want replace or concatenate afterwards:

html += "<p>" + url + "</p>"
$(this).html(html)

this being the <a> in this exemple. Target a div or whatever you want by changing it to the appropriate selector.

于 2013-05-17T10:20:19.193 回答