Question

所以，我决定制作所有内容都在隐藏DIV中的页面。基本上页面开始空白，没有任何内容。单击单选按钮后，它会显示一个DIV，并隐藏另一个DIV。

这是一个名为“Button_name”的按钮，它将打开“opt3”div的内容。

<input id="tab-3" type="radio" name="radio-set" class="tab-selector-3" value="opt3"/>
<label for="tab-3" class="tab-label-3"> BUTTON_NAME </label>

点击后会打开“opt3”div：

<div id="opt3" class="desc" style="display: none;">
content of div
</div>

现在：

如果在打开页面（或由F5刷新）时在新DIV中显示某些文本，但在单击菜单选项中的任何按钮后直接关闭？

编辑：

Script for buttons
$(document).ready(function(){ 
    $("input[name=radio-set]").change(function() {
        var test = $(this).val();
        $(".desc").hide();
        $("#"+test).show();
    }); 
});

好吧，我认为我能以最简单的方式解决这个问题！

如果有人想要和我一样的效果 - 你只需要放入主div（点击菜单按钮后任何其他div将显示）正常的“opt”div，但没有display：none。

<div id="opt20" class="desc" >
Ble ble 20
</div>

仅在页面开始时显示“ble ble 20”，点击任何菜单按钮后将隐藏起来。请确保将来再次使用“opt20”按钮，因为它会显示您的开始内容。

Answer 1

jQuery上有吨的教程和信息。它真的需要玩它并研究它有不同的选择。以下是您可以做的快速示例。不完全是你可能需要的，但它可能会给你一个开始。 jQuery非常强大。您必须在代码中包含jQuery库js文件。 http://jquery.com/

一些HTML

<input id="tab-3" type="radio" name="radio-set" class="tab-selector-3" value="opt3"/> Check me
<br /><input id="btn1" type="button" value="Click Me">
<div id="opt3" class="desc" style="display: none;">
I'm opt3 hidden from the start
</div>
<div id="otherdiv" class="desc" style="display: none;">
some other div that is shown when opt3 is clicked
</div>

和jQuery

$(document).ready(function(){
    $("#btn1").click(function(){
        $("#opt3").show();
        if($("#otherdiv").is(':visible')){
            $("#otherdiv").hide();
        }
    });
    $("#tab-3").change(function(){
        $("#otherdiv").show();
        if($("#opt3").is(':visible')){
            $("#opt3").hide();
        }
    });

});

查看实际操作 http://jsfiddle.net/8fUXW/1/

BTW谷歌特定的东西，然后将它们拼凑在一起，而不是试图找到一个确切的解决方案。那将是非常困难的。

在页面启动时显示DIV，单击任何单选按钮时隐藏

1 个答案: