Question

嗯，我不是jQuery中的大师，但我可以做一些基本的东西。但是我不能明白这一点。我正在收听.btn-delete click事件，将.btn-danger data-route属性（在模态对话框中）设置为.btn-delete data-route属性的值

真的很简单，我知道我做错了。 data-route .btn-danger的值不会更改。非常感谢任何帮助，谢谢。

<!-- modal confirm -->
<div id="modal-delete">
    <a class="btn-danger" data-route="">Confirm</a>
</div>

<!-- delete buttons -->
<a class="bt-delete" data-route="/user/delete/1">Delete</a>
<a class="bt-delete" data-route="/user/delete/2">Delete</a>

<script>
     $(document).ready(function() {

         // Listen to .btn-delete click
         $('.btn-delete').click(function() {

             // Get data-route for the delete button and set it in the modal
             $('#modal-delete .btn-danger')
                 .attr('data-route', $(this).data('ruote'));

             // Do ajax in .btn-danger click event
             $('#modal-delete .btn-danger').click(function() {
                 // data-route does not change
                 console.log($(this).data('route'));
             });
         });
     });
</script>

Answer 1

编辑：您的代码有一堆语法错误+选择器错误（错字类型）。

DEMO

DEMO链接有固定代码，请查看并相应修复您的代码。

$(document).ready(function(应为$(document).ready(function() {
$('.btn-delete').click(function() {应为$('.bt-delete').click(function() {
$(this).data('ruoute')应为$(this).data('route')
$('.btn-delete').click(function() {。
如果使用attr，则console.log应使用attr将内容打印为console.log($(this).attr('data-route'));

注意：最好使用data代替attr功能。有关如何使用data功能的信息，请参见DEMO。

Answer 2

$('#modal-delete .btn-danger').attr('data-route', $(this).data('ruoute'));

应该是

$('#modal-delete .btn-danger').data('data-route', $(this).data('route'));

你应该总是使用.data()方法（不是attr）来获取和设置与节点相关的数据

您的代码中还有另外两个错误：

$(document).ready(function(

应该是

$(document).ready(function() {

和

$('.btn-delete').click(function() {

应该是

$('.bt-delete').click(function() {

我删除了n以匹配HTML

Works fine for me here

点击时的jQuery设置属性不会更改该值

2 个答案: