Question

我正在使用jquery，以便当用户点击链接时，我获得所述链接的ID，然后使用它来选择具有相同ID的li项目并为其设置动画。好吧，至少那就是我要做的......到目前为止，我有：

$(function(){
        $('#slider-buttons a').click(function(){
        var x = $(this).attr('id');
        var y = $('#slider-stage-list li' + x);

        if(x == "inicio")
            $(this).animate({ "left" : "0px"},700);
        else
            $(this).animate({ "left" : (increment*3) + "px"},700);
    });
});

我尝试了各种组合，但我仍然无法让'y'得到与x相同的列表项的值（点击的网址）... x确实获得了正确的ID，但仍然是最多返回“undefined”...这里是html代码...

<div id="slider-buttons">
    <a href="#" id="inicio">Inicio</a> <br />
    <a href="#" id="previous">&iquest;Qui&eacute;nes Somos?</a> <br /> 
    <a href="#" id="clases">Clases</a> <br />
    <a href="#" id="equipo">Equipo</a> <br />
    <a href="#" id="album">&Aacute;lbum</a> <br />
    <a href="#" id="especiales">Eventos Especiales</a> <br />
    <a href="#" id="#">Cont&aacute;ctanos</a> <br />
</div>
<div id="stage">
    <ul id="slider-stage-list">
        <li id="inicio">Inicio</li>
        <li id="nos">&iquest;Qui&eacute;nes Somos?</li>
        <li id="clases">Clases</li>
        <li id="equipo">Equipo</li>
        <li id="album">&Aacute;lbum</li>
        <li id="especiales">Eventos Especiales</li>
        <li id="#">Cont&aacute;ctanos</li>
    </ul>
</div>

任何帮助将不胜感激=）

编辑以回答3个回复

如果我在console.log（）中执行任何操作; “[object Object]”= /

编辑回答BC

感谢HTML修正，如果我写下你给我的jquery代码，我仍然会进入console.log（）; “[object Object]”

编辑'因为我没有得到最后的回复

如果我尝试这种方法，我或者得到“[object Object]”或者没有......

Answer 1

不，不是

这是无效的HTML，因为您的链接与列表项共享相同的ID。

您的代码应该更像这样：

<div id="slider-buttons">
    <a href="#" id="inicio">Inicio</a> <br />
    <a href="#" id="previous">&iquest;Qui&eacute;nes Somos?</a> <br /> 
    <a href="#" id="clases">Clases</a> <br />
    <a href="#" id="equipo">Equipo</a> <br />
    <a href="#" id="album">&Aacute;lbum</a> <br />
    <a href="#" id="especiales">Eventos Especiales</a> <br />
    <a href="#" id="contactanos">Cont&aacute;ctanos</a> <br />
</div>
<div id="stage">
    <ul id="slider-stage-list">
        <li id="item_inicio">Inicio</li>
        <li id="item_previous">&iquest;Qui&eacute;nes Somos?</li>
        <li id="item_clases">Clases</li>
        <li id="item_equipo">Equipo</li>
        <li id="item_album">&Aacute;lbum</li>
        <li id="item_especiales">Eventos Especiales</li>
        <li id="item_contactanos">Cont&aacute;ctanos</li>
    </ul>
</div>

和

$(function(){
        $('#slider-buttons a').click(function(){
        var x = $(this).attr('id');
        var y = $('li#item_' + x);

        if(x == "inicio")
                $(this).animate({ "left" : "0px"},700);
        else
                $(this).animate({ "left" : (increment*3) + "px"},700);
    });
});

Answer 2

var y = $('#slider-stage-list li' + x);

应该是

var y = $('#slider-stage-list li#' + x);
// or
var y = $('#' + x);
// or
var y = $(this);

提到的第三个选项可能是最好的。

但是，您遇到了问题：您的id不是唯一的。这可能是您正在寻找的（无需修改HTML）：

var y = $('#slider-stage-list li').filter(function() {
    return $(this).attr('id') == x;
});

Answer 3

我相信你错过了使用ID选择器的井号。试试这个：

    var x = $(this).attr('id');
    var y = $('#slider-stage-list li#' + x); // Note the 'li#' instead of just 'li'.

jQuery问题

3 个答案: