Question

我有一个切换jquery片段，在我看来它应该可以工作，但事实并非如此。它只允许第一个div切换。如果我删除第一个div集，第二个div开始工作，所以我知道这不是拼写错误或任何东西。

JsFiddle http://jsfiddle.net/kits87/69qnosyb/1/

HTML

def make[T](implicit m : Manifest[T]): T =
  m.runtimeClass.asInstanceOf[Class[T]].newInstance()

make[String] // res0: String = ""

make[AnyRef] // res1: AnyRef = java.lang.Object@7794ed7a

Jquery的

<div>
        <div id="ByteHeaderContainer">
            <div class="ByteHeadTitle"><p>Header</p></div>
        </div>

        <div id="Byte">Copy</div>
</div>       

    <br><br><br>

<div>
        <div id="ByteHeaderContainer">
            <div class="ByteHeadTitle"><p>Header</p></div>
        </div>

        <div id="Byte">Copy</div>
</div>

我错过了什么？

Answer 1

更改

<div id="ByteHeaderContainer">

到

<div class="ByteHeaderContainer">

和

$('#ByteHeaderContainer').click(function() {

到

$('.ByteHeaderContainer').click(function() {

请记住，Id在您的DOM中必须是唯一的，这就是为什么您只能使用第一个元素。

Answer 2

工作小提琴： http://jsfiddle.net/66p2dj1q/

将HTML中的input更改为display: none;（更改为类），CSS和jQuery。

Answer 3

每个元素的id必须唯一。

您可以使用类，但是，根据您的情况解决问题的方法是替换您的代码：

$('[id="ByteHeaderContainer"]').click(function () {
    $(this).next('#Byte').fadeToggle('fast');
    $(this).children('.ByteHeadTitle').fadeToggle('fast');
});

Here is the updated JSFiddle

Answer 4

ID必须是唯一的。尝试在HTML和JS中将#ByteHeaderContainer更改为.byteHeaderContainer，这样就可以了。

切换独立的div不起作用

4 个答案: