0

我正在尝试使用 Jquery 隐藏/显示 DIV。我希望在单击标题时出现一个 div，然后在再次单击（切换）时消失，或者在选择另一个选项时消失。

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">    </script>

<script>
$(document).ready(function (){
$("a1").click(function(){
    $('#analytical').toggle();
});
});

$(document).ready(function (){
$("a2").click(function(){
    $('#test1').toggle();
});
});

</script>


<div id="personalinfo">
<a1><a class="first">A</a><a>nalytical Skills<a/></a1><br/>
<a2><a class="first">T</a><a>est1<a></a2><br/>
</div>


<div id="analytical">
hello
    </div>

<div id="test1">
    Organisational
    </div>

第一个 DIV（组织）确实会切换，但是当单击相关选项时，以下（test1）div 不会切换！

对此进行排序的任何帮助都会很棒。

谢谢。

4

3 回答 3

1

你的结束标签搞砸了

<div id="personalinfo">
    <a1><a class="first">A</a><a>nalytical Skills</a></a1><br/>
    <a2><a class="first">T</a><a>est1</a></a2><br/>
</div>

演示：小提琴

于 2013-09-09T10:52:32.053 回答
0

我会更改 html 标记，使其有效：

<div id="personalinfo">
    <a href="#analytical"><span class="first">A</span>nalytical Skills</a><br/>
    <a href="#test1"><span class="first">T</span>est1</a><br/>
</div>


<div id="analytical">
    hello
</div>

<div id="test1">
    Organisational
</div>

进而：

$(document).ready(function (){
    $("#personalinfo a[href^='#']").on("click", function(e){
        var hash = $(this).attr("href");
        var el = $(hash);
        e.preventDefault();
        el.toggle();
    });
});

它将使用#hash 链接查找#personalinfo 中的所有锚元素，并尝试切换具有哈希标签ID 的元素。

于 2013-09-10T06:31:07.667 回答
0

在你的代码中检查这个nalytical Skills<a/>可能对你有帮助

于 2013-09-10T06:46:36.180 回答