0

特定の div のセットに一致させようとしているメニュー リスト (ul/li) があります。例: li 番号 3 をクリックすると、div 3 にネストされた iframe は、特定の URL を「表示」してロードする必要があります。

$('document').ready(function(){

$('ul li').one('click', function(event) {

    event.preventDefault();

    var index = $('ul li').index(this);


    $("#tab iframe").hide();
    $('#tab > div iframe:eq('+index+')').show();


    $('#tab > div iframe:eq('+index+')').attr("src", "http://mashable.com/");

    }); 

    });

したがって、問題は、他のすべての div iframe に特定の URL をロードしたいということです。現在は URL に違いはありません。例を見てください: JsFiddle

4

2 に答える 2

2

@Youss、これを使って

$('document').ready(function(){
   var URL = ["URL1", "URL2", "URL3"];
   $('ul li').one('click', function(event) {

   event.preventDefault();

   var index = $('ul li').index(this);


   $("#tab iframe").hide();
   $('#tab > div iframe:eq('+index+')').show();


   $('#tab > div iframe:eq('+index+')').attr("src", URL[index]);

  }); 

});

デモ

幸運を

于 2012-09-01T09:59:04.327 に答える
1

ここにいくつかのサンプルhtmlコードがあります

    <ul>
        <li target="http://google.co.uk">li 1</li>
        <li target="http://webdesignseolondon.co.uk">li 2</li>
        <li target="http://marianzburlea.com">li 3</li>
    </ul>

    <div id="tab">
        <div><iframe  id="frame1" src="" scrolling="no" ></iframe></div>
        <div><iframe  id="frame2" src="" scrolling="no" ></iframe></div>
        <div><iframe  id="frame3" src="" scrolling="no" ></iframe></div>
    </div>

そして、ここにあなたのjQueryがあります:

    (function(){

        $('ul li').one('click', function(e) {

            e.preventDefault();

            $("#tab iframe").hide();
            $('#frame'+$(this).index()).show();


            $('#frame'+$(this).index()).attr("src", $(this).attr('target'));

        });

    }) (jQuery);
于 2012-09-01T10:10:36.360 に答える