页面加载

时间:2017-03-05 16:18:52

标签: javascript php jquery html wordpress

我有一个标签式菜单,显示来自不同wordpress类别的内容,例如汽车,卡车和公共汽车。每次重新加载页面时,它会随机选择一个活动选项卡。在选项卡式菜单的内容的底部,有一个"查看更多"链接到相应选定选项卡菜单的完整类别列表的按钮。问题是每当我加载或重新加载页面时,查看更多按钮不会显示活动选项卡菜单的类别页面的任何链接。但是,当我手动点击另一个不应该这样的标签菜单时,链接会显示。请参阅下面选项卡式菜单的代码;

<ul id="myTab" class="nav nav-tabs">
<?php
$taxonomy = 'browse';
$queried_term = get_query_var($taxonomy);
$terms = get_terms($taxonomy, 'slug='.$queried_term);
$items = array("1","2","3");
$array_val = $items[array_rand($items)];
if ($terms) {
    $j = 1;
    foreach($terms as $term) {
        $termname = $term->name;
        $termslug = $term->slug;
        if($j == $array_val){
?>
<li data-id="<?php echo trim($termslug);?>" class="active"><a data-toggle="tab" data-target="#m-<?php echo trim(str_replace('/','',$termname));?>" aria-expanded="false"><?php echo trim($termname);?></a></li>
<?php 
        } else { 
?>
<li data-id="<?php echo trim($termslug);?>"><a data-toggle="tab" data-target="#m-<?php echo trim(str_replace('/','',$termname));?>" aria-expanded="false"><?php echo trim($termname);?></a></li>
<?php 
        }
        $j++;
    } 
}
?>                  
</ul>

在选项卡式菜单内容的底部,这是&#34;查看更多&#34;的代码。链接到下面相应的选定标签菜单的按钮;

<a href="" class="nymcls">
    <input type="submit" value="View More" class="btnclass">
</a>

这是jquery代码,似乎只有在我点击选项卡式菜单时才会起作用。我希望它也可以在加载页面时分配随机选择的选项卡式菜单的相应链接。

<script> 
$(document).ready(function() {   
    $("#myTab li").click(function() {
        var templateDir = '<?php echo site_url(); ?>/';         
        var catname = $(this).data("id");
        var cat = "browse/"
        $('a.nymcls').each(function() {
            ($(this).attr('href', templateDir + cat + catname +'/?top_rate=yes'));  
        });
    });
});
</script>

1 个答案:

答案 0 :(得分:0)

你也需要调用更新链接的功能,也可以在页面加载时调用。不仅一旦用户点击它们

function updateMoreLink( catname ){
    var templateDir = '<?php echo site_url(); ?>/'; 

    var cat = "browse/"

    $('a.nymcls').each(function() {
        ($(this).attr('href', templateDir + cat + catname +'/?top_rate=yes'));
    });
}

$(document).ready(function(){

    $("#myTab li").click(function(){
        updateMoreLink($(this).data("id"));
    });

    updateMoreLink( $("#myTab li.active").data("id") );

});