Question

有没有办法用Jquery显示具有相同id和类onClick的2个Div，无法解决此问题。（Div1 / Class targetDiv）

Html：

<div class="buttons">
    <a  class="showSingle" data-target="1">Option 1</a> //With this
    <a  class="showSingle" data-target="2">Option 2</a>
    <a  class="showSingle" data-target="3">Option 3</a>
    <a  class="showSingle" data-target="4">Option 4</a>
</div>

<div id="div1" class="targetDiv">Lorum Ipsum 1</div> //Show this
<div id="div1" class="targetDiv">Lorum Ipsum 1 Second</div> //And this
<div id="div2" class="targetDiv">Lorum Ipsum 2</div>
<div id="div3" class="targetDiv">Lorum Ipsum 3</div>
<div id="div4" class="targetDiv">Lorum Ipsum 4</div>

Jquery的：

$('.showSingle').on('click', function () {
    $(this).addClass('selected').siblings().removeClass('selected');
    $('.targetDiv').hide();
    $('#div' + $(this).data('target')).show();
});
$('.showSingle').first().click();

小提琴： https://jsfiddle.net/XwN2L/5709/

非常感谢你的帮助！

Answer 1

在一个页面上不可能出现多个ID。

ID =标识符

如果你想拥有＆＃34;绑定＆＃34;您页面上元素的可见性，您可以使用具有相同值的数据属性。

例如：

<div class="links">
    <a href="#group-1">Group 1</a>
    <a href="#group-2">Group 2</a>
    <a href="#group-3">Group 3</a>
  </div>

  <div class="some-class" data-id="group-1"></div>
  <div class="some-class" data-id="group-1"></div>
  <div class="some-class" data-id="group-2"></div>
  <div class="some-class" data-id="group-3"></div>
  <div class="some-class" data-id="group-2"></div>

然后：

var $links = $( '.links' ).find( 'a' );

$links.on( 'click', function ( e ) {
    e.preventDefault();

  var group = $( this ).attr( 'href' ).replace( '#', '' );

  $( '.some-class' ).hide();
  $( '.some-class[data-id="' + group + '"]' ).show();
});

显示具有相同ID和类onClick的2个Div

1 个答案: