Question

我有一个使用以下脚本的网站：

//==================== EXPAND ========================//
$('a.expand').live('click',function() {

    var _hide   = $(this).attr('data-hide');

    $(this).addClass('activeSpan');
    $(this).parent().find('.details-post').slideDown(); 
    $(this).parents('li').find('.grid-reply').slideDown(); 
    $(this).parents('li').find('.spanReply').slideDown();       
    $(this).parent().find('.textEx').html(_hide); 
    $(this).removeClass('expand');

    if( $(this).hasClass( 'reply' ) )
    {
        $(this).parent().find('#reply_post').focus();
    }
});

$('a.activeSpan').live('click',function() {
    var _expand = $(this).attr('data-expand');

    $(this).addClass('expand');
    $(this).parent().find('.details-post').slideUp();
    $(this).parents('li').find('.grid-reply').slideUp();
    $(this).parents('li').find('.spanReply').slideUp(); 
    $(this).parent().find('.textEx').html(_expand); 
    $(this).removeClass('activeSpan');
});

$('.optionsUser > li:last').css({'border':'none'});

用于在用户点击＆＃34;展开＆＃34;时显示数据。而不是这个，我希望文本自动出现。我该如何更改脚本？我尝试过改变直播（＆＃39;点击＆＃39;生活（＆＃39;加载＆＃39;但这不起作用。

该网站使用：https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

提前致谢。

这是php代码：

<!-- EXPAND -->
<a data-expand="<?php echo $_SESSION['LANG']['expand']; ?>" data-hide="<?php echo $_SESSION['LANG']['hide']; ?>" class="expand getData" data="<?php echo $key['id']; ?>" data-token="<?php echo $key['token_id']; ?>">
<?php echo $icon; ?>
<span class="textEx"><?php echo $_SESSION['LANG']['expand']; ?></span> <?php echo $typeMedia; ?>
</a>

这是示例html：

<a data-expand="Expand" data-hide="Collapse" class="expand getData" data="697" data-token="0f1966ac9d8529055f9b0e09c0a58a65cdf5d5e8">                                  <span class="textEx">Genişlet</span>             </a>

想想facebook或twitter，点击展开，你会得到一个区域来回复帖子。目前我必须单击以查看回复表单，但我希望默认情况下显示该表单。

Answer 1

您可以使用自定义事件或只是以编程方式触发点击：

$(function(){//run on page load

    $('a.expand').live('click',function() {

        var _hide   = $(this).attr('data-hide');

        $(this).addClass('activeSpan');
        $(this).parent().find('.details-post').slideDown(); 
        $(this).parents('li').find('.grid-reply').slideDown(); 
        $(this).parents('li').find('.spanReply').slideDown();       
        $(this).parent().find('.textEx').html(_hide); 
        $(this).removeClass('expand');

        if( $(this).hasClass( 'reply' ) )
        {
            $(this).parent().find('#reply_post').focus();
        }
    });

    $('a.activeSpan').live('click',function() {
        var _expand = $(this).attr('data-expand');

        $(this).addClass('expand');
        $(this).parent().find('.details-post').slideUp();
        $(this).parents('li').find('.grid-reply').slideUp();
        $(this).parents('li').find('.spanReply').slideUp(); 
        $(this).parent().find('.textEx').html(_expand); 
        $(this).removeClass('activeSpan');
    });

    $('a.expand').trigger("click");//trigger click on page load

    $('.optionsUser > li:last').css({'border':'none'});
});

Answer 2

如果将代码从匿名函数移动到a.expand并绑定到命名函数，那么您需要做的就是在DOM准备就绪时调用它，然后您也可以将函数传递给您a.expand处理程序。

$(function(){
  $('a.expand').live('click', Expand);

  Expand(); // Invoke function

  $('a.activeSpan').live('click',function() {
    var _expand = $(this).attr('data-expand');

    $(this).addClass('expand');
    $(this).parent().find('.details-post').slideUp();
    $(this).parents('li').find('.grid-reply').slideUp();
    $(this).parents('li').find('.spanReply').slideUp(); 
    $(this).parent().find('.textEx').html(_expand); 
    $(this).removeClass('activeSpan');
  });

  $('.optionsUser > li:last').css({'border':'none'});
});
//Extracted function
function Expand() {

var _hide   = $(this).attr('data-hide');

$(this).addClass('activeSpan');
$(this).parent().find('.details-post').slideDown(); 
$(this).parents('li').find('.grid-reply').slideDown(); 
$(this).parents('li').find('.spanReply').slideDown();       
$(this).parent().find('.textEx').html(_hide); 
$(this).removeClass('expand');

if( $(this).hasClass( 'reply' ) )
{
    $(this).parent().find('#reply_post').focus();
}
}

页面加载时的JQuery而不是单击live（）

2 个答案: