javascript - ホバーしてDIVを開くと、DIVコンテンツは別のURLから動的に読み込まれる必要があります

Question

誰かがすでにこれを行ってオンラインで投稿したと確信していますが、そのような例やチュートリアルを見つけるのに苦労しています。

基本的に、ページに一連のリンクを配置したいと思います。リンクにマウスを合わせると、リンクの下にあるドロップダウンDIVボックスが開き、事前定義されたリモートURLからコンテンツがDIVに読み込まれます。

誰かがそのような実装を見たことがありますか、またはjQueryでそれを行う方法について何かアイデアがありますか？

Answer 1

私はあなたが似たようなものを探していると思います：

$(document).ready(function(){
    $("a").hover(function(){ //When a given link (<a> tag) is hovered over
       $("div").load(this.href).show(); //load the src of that tag into a given div container.
    });
});

これはjsFiddleでの簡単なテストですが、hrefで何を入力すればよいかわかりませんでした...表示されるのは、投稿エラーでdivが表示されることだけです...あまりきれいではありませんが、誰かが提案を持っている場合は、私は間違いなくすべての人に開かれています。

http://jsfiddle.net/ChaseWest/VEuH9/2/

Answer 2

私は次のようなもので行きます。loadedクラスを持たないアンカーのみを対象としていることに注意してください。その理由は、アンカーのコンテンツを複数回ロードしたくないためです。ユーザーがアンカーを通過するたびに、そのコンテンツが読み込まれ、これを示す特別なクラスが取得されます。彼らが再びそれを通過した場合、何も起こりません。

$("body").on("mouseenter", "a:not(.loaded)", function(e){
  $(".mydiv").load(e.target.href, function(){
    $(e.target).addClass("loaded");
  });
});