Question

几天前我尝试创建一个系统，当你点击时，jQuery将使我能够显示链接和div，

项目链接：http://jsfiddle.net/HCAfz/

一个主要条件是，当您点击打开的链接并更改了一个div的状态，而不是页面上的所有div。

我在每个类别中都是40这样的div，再次在css div中创建单独的类，忽略了这一点。

我的项目在jquery中可以完成什么？任何建议

Answer 1

您可以使用next：

执行此类操作

http://jsfiddle.net/HCAfz/2/

$('a.yourLink').click(function(event) {
        event.preventDefault();
        event.stopPropagation();
        $(this).next('.hiddenDiv').show();
        window.open(this.href, '_blank');
 });

Answer 2

如果您尝试更改div的内容，请特别通过ID调用它。只需设置属性id ='something'并使用JQuery调用它：$（'＃something'）。html（'将此HTML添加到div'）

使用CSS时非常相似。只需指定一个ID或类，然后按照它设置样式规则。

Answer 3

您可以使用更通用的程序。

<a href="http://www.yoursite.com/otherLink" 
   id="yourId" 
   class="opens-a-link-and-shows-a-div">Click here</a>
<div id="div-to-show-when-yourId-clicked" style="display: none">
    Your link has opened in a new window
</div>

和javascript

$('a.opens-a-link-and-shows-a-div').click(function(event) {
      event.preventDefault();
      event.stopPropagation();
      var div_name = '#div-to-show-when-%-clicked'
          .split('%').join($(this).attr('id'));
      $(div_name).show();
      window.open(this.href, '_blank');
 });

（参见我的fork）

Answer 4

如果我正确理解您的问题，HTML的扩展版本将如下所示：



    <a href="http://www.yoursite.com/otherLink" target="blank_"  id="yourId">Click here</a>
    <div class="hiddenDiv">Your link has opened in a new window</div>
    <div class="hiddenDiv">Your 2nd link has opened in a new window</div>
    <div class="hiddenDiv">Your 3rd link has opened in a new window</div>
    <div class="hiddenDiv">Your 4th link has opened in a new window</div>

你可以使用这个jQuery在链接后只打开div而不是在同一个类中打开其他人：



    $('a#yourId').click(function(event) {
          event.preventDefault();
          event.stopPropagation();
          $(this).next('.hiddenDiv').show();
     });

同时打开一个链接和一个div

4 个答案: