Question

我会说得很简单：

我有：

<a id="edit" data-link="mylink">Edit</a>
<a id="edit" data-link="mylink2">Edit2</a>
<div id="modal">

</div>

<script>
    $('#edit').click(function(){
        var href = $(this).data('link');
        $( "#modal" ).load( href );
    });
});
</script>

它可以工作，但只有第一个按钮，不是第一个请求，只有第一个按钮，它可能是第10个请求，只有第一个按钮加载，其他不加载，我检查链接和工作。< / p>

Answer 1

ID元素必须是唯一的。

ID - 属性

id属性指定其元素的唯一标识符（ID）。该 value必须在元素的home子树中的所有ID中唯一并且必须至少包含一个字符。该值不得包含任何空格字符

使用class属性对类似元素进行分组

<a class="edit" data-link="mylink">Edit</a>
<a class="edit" data-link="mylink2">Edit2</a>

然后使用class selctor

$('.edit').click(function(){
        var href = $(this).data('link');
        $( "#modal" ).load( href );
    });
});

当你使用id-selector时，它将获取具有给定id的第一个元素，因此你的click处理程序只能注册到第一个链接元素

Answer 2

<a **id="edit"** data-link="mylink">Edit</a>
<a **id="edit"** data-link="mylink2">Edit2</a>

此处复制id。 ID必须是唯一的。

Answer 3

当您选择使用ID选择器时，jQuery将只返回一个元素，因为ID在页面上必须是唯一的。因此只有一个href被加载。您必须将选择器更改为类选择器，如下所示。请注意，这两个链接现在具有不同的ID并具有公共类。多个元素可以具有相同的类，jQuery选择器将返回该特定类的所有元素（在本例中为“editLink”）

<a id="edit1" class="editLink" data-link="mylink">Edit</a>
<a id="edit2" class="editLink" data-link="mylink2">Edit2</a>
<div id="modal">

</div>

<script>
    $('.editLink').click(function(){
        var href = $(this).data('link');
        $("#modal").load( href );
    });
});
</script>

jquery .load（）只加载第一个请求

3 个答案: