0

我正在使用 Twitter Bootstrap 的按钮组在不同的内容之间切换。可以在http://jsfiddle.net/g8KSf/看到一个例子

基本上，如果您单击“游戏”，games_container div 将出现，而其他 div 将被隐藏。我的工作正常。

我将帖子类型存储在数据库中，如帖子、游戏、视频等，我希望能够在页面加载时打开相关的 div，而不仅仅是点击。现在 post_container 在页面加载时默认显示。

假设我有一个 PHP 变量$post_type = 'game';，我怎样才能让 game_container 在页面加载时显示，同时仍然通过单击来切换它？

这是我到目前为止的js：

$('.container').hide();
$('#post_container').show();

$('.post_types button').click(function(){
        var target = "#" + $(this).data("target");
        $(".container").not(target).hide();
        $(target).show();
        $('#post_type').val($(this).text());
});​
4

4 回答 4

2

要在加载时显示游戏容器，您需要替换此行

$('#post_container').show();

到

$('#game_container').show();

参考现场演示

而且目前您正在使用

$('#post_type').val($(this).text());

在这里，而不是使用this这一行$(this).text()，使用target如下变量

$('#post_type').val($(target).text());

更新：

要在页面加载时动态显示，

  1. 将 post_type 的值存储在变量中

    var ptype = ...STORE THE POST TYPE VALUE...;

  2. 将值传递到此行

    $('#'+ptype+'_container').show();
    或者
    $('#'+$post_type+'_container').show();

参考现场演示 2

于 2012-08-03T15:45:34.613 回答
0

更改$('#post_container').show();为$('#game_container').show();

你去http://jsfiddle.net/g8KSf/5/

我php对这里的动态不太熟悉：

function(){ $.ajax({ 
       type:"GET", 
       url:"file.php", 
       data:id, 
       success:function(container){ 
           $('#'+container).show();
       }, 
       // ... more ...
    }
于 2012-08-03T15:46:04.620 回答
0

只需show()使用您喜欢的选择器在页面加载时运行。

$(function() {
    $('#<?=$post_type?>_container').show();
});

<?=?>用于 echo 的简短 PHP，您不能在 .js 文件中使用它。如果我指出的方式不适合您，您应该为您喜欢的选择器设置一个全局变量并使用它而不是内联 PHP。

于 2012-08-03T15:46:56.790 回答
0

您可以：

  • 将第二行更改#post_container为#game_container直接在您的 JavaScript 代码中
  • 或$('#btn-game').click();之后调用，例如在onload属性中body或在单独的script标签中。
于 2012-08-03T15:48:26.067 回答