Question

我有一个简单的jquery淡入淡出工作，我试图让它在打开页面时自动显示第一个div。

目前，当页面加载时，没有内容

 $(".link").click(function(e) {
      e.preventDefault();
      $('.content-container div').fadeOut('slow');
      $('#' + $(this).data('rel')).fadeIn('slow');
  });

Answer 1

到目前为止，您正在通过此代码注册每个链接的点击事件

$(".link").click(function(e) {
    e.preventDefault();
    $('.content-container div').fadeOut('slow');
    $('#' + $(this).data('rel')).fadeIn('slow');
});

我建议在页面文档对象模型（DOM）准备好执行JavaScript代码后触发单击

请尝试使用您的代码

$( document ).ready(function() {
    $(".link")[0].click(); 
});

Fiddle

Answer 2

只要在DOM完全加载时执行.show（）函数：

$(function() {
     $('#content1').show();
});

http://jsfiddle.net/Wqc9N/11/

Answer 3

尝试

$('#' + $('a:eq(0)').data('rel')).fadeIn('slow');

$(".link").click(function(e) {
  e.preventDefault();
  $('.content-container div').fadeOut('slow');
  $('#' + $(this).data('rel')).fadeIn('slow');
});

Fiddle Demo

希望有所帮助

Answer 4

我没有发现显示第一个div的任何困难

$('#content1').fadeIn('slow');
$(".link").click(function(e) {
      e.preventDefault();
      $('.content-container div').fadeOut('slow');
      $('#' + $(this).data('rel')).fadeIn('slow');
  });

Updated demo

jQuery淡入淡出 - 在页面加载时显示div

4 个答案: