Question

jsfiddle.net/qdfET/1/

当我点击帮助1链接时我想这样做，那么它应该在弹出窗口中转到C1的内容，并且同样用于帮助2链接。但它并没有像那样工作。我知道它的小东西，但它在同一页面上工作正常，但在jquery弹出窗口中却没有。

请告知此事。

Answer 1

首先，如果你尊重W3C，那么id标签必须是唯一的，如Curt所说，

我建议2个解决方案，第一个是转到右侧帮助块，第二个是仅显示正确的帮助块

对于您的问题，在每种情况下，第一个块都更好：

<div class='popup'>
  <div class='content' style='overflow:auto; width:800px;height:400px;'>
    <div id="C1">
      <span class="Heading">Title 1 come here</span><br/>text for title 1 will come here.</span>
    </div>
    <div id="C2">
      <span class="Heading">Title 2 come here</span><br/>text for title 2 will come here.</span>
    </div>
  </div>
</div>

如果你想goTo元素，你需要在href中添加#in，因为Curl说：你的链接：

<div class='container' align="right">
      <!-- return false; only to do it better -->
      <a href='#C1' class='Link'>Help 1</a>
    </div>
    <div class='container' align="right">
      <a href='#C2' class='Link'>Help 2</a>  
    </div>

也许它不起作用，因为弹出窗口在<body>的顶部或底部，并且在你调用它时不滚动，所以我建议第二个解决方案有一个很棒的弹出窗口：

下一部分是隐藏的部分，你不想要你的链接：

    <div class='container' align="right">
      <!-- return false; only to do it better -->
      <a href='return false;' data-open="C1"  class='Link'>Help 1</a>
    </div>
    <div class='container' align="right">
      <a href='return false;' data-open="C2" class='Link'>Help 2</a>  
    </div>

最后改变你的javascript：

$('.Link').click(function(){
  overlay.show();
  var id = $(this).attr("data-open"); // get ID to show
  $('.popup div').hide(); // hide other
  $("#"+id).show(); // show all div with ID in data-open
  overlay.appendTo(document.body);
  $('.popup').show();
  return false;
});

弹出标记链接无法在jquery中弹出

1 个答案: