Question

我正在学习jQuery。

我在HTML文件中有以下代码块：

<table width="100%">
<tr>
    <td align='center'>
        <div>
            <a id='get_this' href='#'>
            <input type='hidden' id='id' value='1'><img src='images/1.gif'></a>
        </div>
    </td>
    <td align='center'>
        <div>
            <a id='get_this' href='#'>
            <input type='hidden' id='id' value='2'><img src='images/2.gif'></a>
        </div>
    </td>
    <td align='center'>
        <div>
            <a id='get_this' href='#'>
            <input type='hidden' id='id' value='3'><img src='images/3.gif'></a>
        </div>
    </td>
</tr>

我想要做的是，当我点击任何图片时，我可以得到＆lt;输入隐藏＆gt;值，以便我可以显示信息。例如，我单击id = 1，然后我将在其他地方显示有关id1的信息。我试过这个：

$("a#get_this").click(function(){
        var id = $('input[type=hidden]#id').val();
        window.alert("You have chosen the id: " + id);
});

它总是返回id：1给我。

Answer 1

在HTML文档中，ID必须是唯一的。我认为如果您有多个具有相同ID的元素，则行为是未定义的，但大多数浏览器可能会选择第一个元素。

改用类：

<table width="100%"> 
<tr> 
    <td align='center'> 
        <div> 
            <a class='get_this' href='#'> 
            <input type='hidden' value='1'><img src='images/1.gif'></a> 
        </div> 
    </td> 
    <td align='center'> 
        <div> 
            <a class='get_this' href='#'> 
            <input type='hidden' value='2'><img src='images/2.gif'></a> 
        </div> 
    </td> 
    <td align='center'> 
        <div> 
            <a class='get_this' href='#'> 
            <input type='hidden' value='3'><img src='images/3.gif'></a> 
        </div> 
    </td> 
</tr>

和JS：

$("a.get_this").click(function(){
        // find all input elements inside "a" (which is only one)
        var id = $(this).find('input').val(); 
        window.alert("You have chosen the id: " + id);
    });

Answer 2

当ID应该是唯一的时，您会多次使用相同的ID。你应该使用类来代替：

<a class='get_this' href='#'>

然后

$("a.get_this").click(function(){

Answer 3

id在文档中应该是唯一的。将ID get_this更改为类：

<a class="get_this" href="#">..</a>

然后，您可以将输入字段的值设为：

$("a.get_this").click(function() {
    var id = $(this).children("input:hidden").val();
    window.alert("You have chosen the value: " + id);
});

隐藏的输入标记可以是：

<input type='hidden' value='1'>

请注意，执行以下操作时，某些浏览器可能会返回多于1个结果：

$("a#get_this").length

但这种行为无法保证，你永远不应该依赖它。为此目的，最好使用类或其他东西。

Answer 4

ID必须是唯一的，因此您不能拥有多个具有相同ID的元素。但是如果您想要这个，您可以将点击处理程序附加到图像，添加'的ID数据'你想要你的图像（让我们说<img id="data1" ... />）。现在你拥有它。

备注：ID不能以数字开头。他们必须以一封信开头。

如何在jQuery中获得独特的价值？

4 个答案: