将鼠标hover在索引页面中的元素上时显示不同页面的div

我最近开始学习Javascript语言，我已经遇到了麻烦。 我想要做的是用鼠标hover显示另一个页面的div内容（在同一个域但不同的文件夹）。 我设法得到两个脚本。 第一个脚本适合显示div，但只显示不同的div在同一页面中。 这是它的两个部分（首先是Javascript，第二部分是html）：

http://pastebin.com/sHbh7jhn

   
 Content goes here.  

我也看到这个（第二个）完全不同的代码也工作，甚至显示不同页面的div。 此代码的问题在于页面加载，即时显示，不会hover在任何内容上等。

 jQuery(function($){ $('#mydiv').load('ContentName'); }); 

我在这里搜索了答案，但我没有在这里或其他任何地方找到答案。 我应该如何编辑代码（第一个或第二个），以便鼠标hover（在div上）我可以看到其他页面的div（如果可能的话，如何组合这两个代码）？

由于我是新手，可能会遗漏一些东西。

Answer 1

1. 将url内容加载到某个隐藏的div

    jQuery(function ($) { $('#hidden_div_id').load("http://..."); }); 

2. 将hover事件添加到您的div

    $("#mydiv").mouseover(function () { document.getElementById("mydiv").innerHTML = document.getElementById("loaded div id").innerHTML; }); 

在mouseover事件内部编写你的函数，选择一些特定的div内容并将其插入你的div。 这可能是解决方案。

但最好的解决方案是创建特定的div，其中只包含所需的数据并将其包含在鼠标hover上。

Answer 2

请参阅jQuery.load（）API

总之，你可以做到

$（“＃myDiv”）。load（“/ mistath / some.html #someDivId”）;

然而，解决这个问题的干净方法是将#someFicId的内容保存在一个单独的片段文件中，并确保它具有严格的HTML / CSS

$（“＃myDiv”）。load（“/ mistath / someFragment.frag.html”）;