Question

这是我使用Jquery的第一天，我想从被点击的元素中检索id并将id传递给另一个元素。到目前为止，我知道根据我的代码，id fetch工作正常，但是我无法将值传递给另一个元素！我在哪里出错了。
这是代码。

$(function() {
    $(".prs").click(function(e) {
        e.preventDefault();
        var x= $(this).get(0).id);
        $("span #x").slideToggle("slow");
    });
});

我想将检索到的id传递给span的id，就像在最后一行代码中一样。

Answer 1

这与jQuery无关，这是一个JavaScript问题。您需要连接字符串和变量。试试这个：

$(function() {
    $(".prs").click(function(e) {
        e.preventDefault();
        var x= $(this).get(0).id);
        $("span #" + x).slideToggle("slow");
    });
});

但是，只是旁注。您不需要jQuery来获取id。只需使用这样的JavaScript：

var x= this.id;

所以你的代码可以像这样简化：

$(function() {
    $(".prs").click(function(e) {
        e.preventDefault();
        $("span #" + this.id).slideToggle("slow");
    });
});

最后，只是关于ids的评论，有两个具有相同ID的项目是无效的HTML。因此，您必须为他们提供不同的ID，对可点击元素说my_object，对跨度说my_oject_box。然后你的代码变成：

$(function() {
    $(".prs").click(function(e) {
        e.preventDefault();
        $("#" + this.id + "_box").slideToggle("slow");
    });
});

Answer 2

这可能会对你有帮助。

$(function() {
  $(".prs").click(function(e) {
      e.preventDefault();
      var x= $(this).attr('id');
      $("span #" + x).slideToggle("slow");
   });
});

Answer 3

var x= $(this).get(0).id; 
$("span#"+x).slideToggle("slow")

$（“span＃”+ x）将访问相同的范围 $（“span＃”+ x）是在span中访问具有该id的元素，但我认为让两个元素具有相同id是不好的做法。

Answer 4

从你的代码中我看到你在同一个元素上触发幻灯片动画（因为ID在页面中是唯一的，并且不能有相同的ID元素），所以你可以这样做：

＆＃13;

$(document).ready(function() {
  $(function() {
    $(".prs").click(function() {
      $(this).slideToggle("slow");
    });
  });
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id-1" class="prs">ID-1</div>
<div id="id-2" class="prs">ID-2</div>

＆＃13;

要从其他元素触发幻灯片，您可以使用数据属性将其作为目标（data-target="..." = $.data('target')

＆＃13;

$(document).ready(function () {
  $('button').click(function () {
    var target = $(this).data('target');
    $(target).slideToggle('slow');
  });
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id-1">ID-1</div>
<div id="id-2">ID-2</div>
<hr/>
<button data-target="#id-1">Turn on/off #1</button>
<button data-target="#id-2">Turn on/off #2</button>

＆＃13;

Jquery将检索到的值传递给另一个id

4 个答案: