Javascript 我怎样才能只为一个元素创建这个？_Javascript_Jquery

Javascript 我怎样才能只为一个元素创建这个？

javascript jquery

Javascript 我怎样才能只为一个元素创建这个？,javascript,jquery,Javascript,Jquery,此代码适用于页面中的所有跨距。对于特定的一个，我应该将此放在哪里 var next=函数（e）{ 当前变量=$（'.active'）； var prev=$（“#prev”）； pos=$（'.active'）.attr（'id'）； $（“#num”）.text（“（“+pos+”/“+researchPlaces.length+”）”）； $（当前）.next（）.attr（“类”，“活动”）； $（当前）.attr（“类”、“被动”）； e、停止传播（）； } 上埃尔金街0号埃尔

此代码适用于页面中的所有跨距。对于特定的一个，我应该将此放在哪里

var next=函数（e）{
当前变量=$（'.active'）；
var prev=$（“#prev”）；
pos=$（'.active'）.attr（'id'）；
$（“#num”）.text（“（“+pos+”/“+researchPlaces.length+”）”）；
$（当前）.next（）.attr（“类”，“活动”）；
$（当前）.attr（“类”、“被动”）；
e、 停止传播（）；
}


上
埃尔金街0号
埃尔金街1号
埃尔金街2号
埃尔金街3号
埃尔金街4号
埃尔金街5号
埃尔金街6号
埃尔金街7号
埃尔金街8号
埃尔金街9号
下一个

因此，如果活动更改，则可以在单击事件中使用

this

。希望HTML和JS能帮助您澄清哪里出了问题。一旦你陈述了

pos

和

researchPlace

应该是什么，我会为你更新它。

所以让我来完成我帮助你的最后一个答案

var addyCount=$（“.addy”）.length；//获取项目的计数
$（“#address”）。在（“click”、“a”上，函数（）{//将click处理程序添加到锚点
var last=$（“.active”）.toggleClass（“active-passive”）；//选择当前的活动项。它删除活动类，添加被动类
var dir=$（this.data（“dir”）；//将next/prev存储为数据属性，因此需要单击处理程序
var sib=last[dir]（“.passive”）；//查找下一个/上一个被动同级
if（sib.length==0）{
sib=last；//如果找不到下一个/上一个，则只选择最后一个选定的
}
sib.toggleClass（“主动-被动”）；//添加主动和删除被动
$（“#num”）.html（（sib.index（“.addy”）+1）+“/”+addyCount）；//index（）从零开始，因此需要添加一个。
});
.active{
显示：块
}
.被动的{
显示：无
}

1.
上
埃尔金街0号
埃尔金街1号
埃尔金街2号
埃尔金街3号
埃尔金街4号
埃尔金街5号
埃尔金街6号
埃尔金街7号
埃尔金街8号
埃尔金街9号
下一个
测试这个；）：

这是一个测试
$（文档）.ready（函数（）{
var prev=$（“#prev”）；
var next=$（“#next”）；
var cur=$（“#address.active”）；/*只是在#address中跨越了它*/
var curNum=parseInt（cur.text（）.match（/\d+/）；
/*下一个函数#############*/
下一步。单击（函数（）{
if（cur.next（）.attr（“id”）！=“next”）{
curNum+=1；
$（“#num”）.text（curNum）；
当前属性（“类”、“附加被动”）；
cur=cur.next（）；
当前属性（“类”，“添加活动”）；
}
});
/*##########prev函数###############*/
上一个单击（函数（）{
if（cur.prev（）.attr（“id”）！=“prev”）{
curNum-=1；
$（“#num”）.text（curNum）；
当前属性（“类”、“附加被动”）；
cur=cur.prev（）；
当前属性（“类”，“添加活动”）；
}
});
});
1.
上
埃尔金街0号
埃尔金街1号
埃尔金街2号
埃尔金街3号
埃尔金街4号
埃尔金街5号
埃尔金街6号
埃尔金街7号
埃尔金街8号
埃尔金街9号
下一个
id必须唯一。您应该使所有的id
唯一。例如，address1
，address2
，等等。有那么多人不介意别人分享他们的id
，这是难以置信的。那有多好？我把它们做成了1,2,3,4,5，但仍然不起作用。我看到你没有使用你另一个问题中的代码。你期望pos是什么？什么是$（“#num”）
？什么是researchPlaces？
<div class="container">
  <span id="address1" class="passive active">0 Elgin Street</span>
  <span id="address2" class="passive">1 Elgin Street</span>
  <span id="address3" class="passive">2 Elgin Street</span>
  <span id="address4" class="passive">3 Elgin Street</span>
  <span id="address5" class="passive">4 Elgin Street</span>
  <span id="address6" class="passive">5 Elgin Street</span>
  <span id="address7" class="passive">6 Elgin Street</span>
  <span id="address8" class="passive">7 Elgin Street</span>
  <span id="address9" class="passive">8 Elgin Street</span>
  <span id="address10" class="passive">9 Elgin Street</span>
</div>

$(function(){
    var current = $('.active');
    var prev = $('#prev');
    $('.active').on('click',function(){
         alert(this.id);
     });
 });

<html>
  <head>
    <title>this is a test</title>
    <meta content="">
      <style></style>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
      <script type="text/javascript">
    $(document).ready(function(){
    var prev = $("#prev");
    var next = $("#next");
    var cur = $("#address .active"); /* just spans that in the #address ! */
    var curNum = parseInt(cur.text().match(/\d+/));
    /* ############ the next function  #############*/
    next.click(function(){
    if(cur.next().attr("id") != "next"){
    curNum += 1;
    $("#num").text(curNum);
    cur.attr("class","addy passive");
    cur = cur.next();
    cur.attr("class","addy active");
    }
    });
    /* ########### the prev function ###############*/
    prev.click(function(){
    if(cur.prev().attr("id") != "prev"){
    curNum -= 1;
    $("#num").text(curNum);
    cur.attr("class","addy passive");
    cur = cur.prev();
    cur.attr("class","addy active");
    }
    });
    });
      </script>
    </head>
    <body>

      <div id="num">1</div>
      <div id="address"> <a id="prev" data-dir="prev">Prev </a>
      <span class="addy active">0 Elgin Street</span>
      <span class="addy passive">1 Elgin Street</span>
      <span class="addy passive">2 Elgin Street</span>
      <span class="addy passive">3 Elgin Street</span>
      <span class="addy passive">4 Elgin Street</span>
      <span class="addy passive">5 Elgin Street</span>
      <span class="addy passive">6 Elgin Street</span>
      <span class="addy passive">7 Elgin Street</span>
      <span class="addy passive">8 Elgin Street</span>
      <span class="addy passive">9 Elgin Street</span>
      <a id="next" data-dir="next"> Next</a>
      </div>

    </body>
  </html>