首页 > 解决方案 > jQuery 我不能动态地将变量分配给元素的 val 属性

问题描述

我使用 ajax 添加列表元素#exercise-checkbox-list,此代码适用于后端,当用户第一次添加练习时一切正常,但第二次新练习的 id 成为第一个添加元素的 this 标签(<a href='#' val ="user_exercise_id" class="fa fa-times">) val 因为 jQuery('#exercise-times-button').attr('val', user_exercise_id) 此代码通过查看元素 id 设置 val 并且所有练习都有相同的id 所以它改变了第一个元素的标签的 val。如何解决这个问题?

     jQuery.ajax({
                  url: '/ajax/add_exercise/',
                  dataType: 'json',
                  data: {
                     'exercise_type': 0,
                     'exercise_id': exercise_id,
                     'duration': duration,
                     'daily_person_id': daily_person_id,
                     'daily_exercise_program_id': daily_exercise_program_id,
                     'csrfmiddlewaretoken': '{{ csrf_token }}',
                    },
                     type: 'POST',
                     success: function (data) {
                       user_exercise_id = data.user_exercise_id;
                       console.log(user_exercise_id);              
                       jQuery("#exercise-checkbox-list").append('<li> <label> <span><strong>' + exercise_name + "| " + duration + " min" + " | " + how_many_calorie_burn + " cal burned" + '<strong></span>\n <a href=\'#\'\n' +
                                        '                                                               class="fa fa-pencil"></a>\n' +
                                        '                                                            <a href=\'#\' val="user_exercise_id" class="fa fa-times"></a> </label> </li>');
                      jQuery('#exercise-times-button').attr('val', user_exercise_id);
                      }
            });

标签: jqueryajax

解决方案


我认为您可以像这样在标签中添加 ID

<a href="#" id="myTag"></a>

然后像这样添加attr:

 jQuery.ajax({
              url: '/ajax/add_exercise/',
              dataType: 'json',
              data: {
                 'exercise_type': 0,
                 'exercise_id': exercise_id,
                 'duration': duration,
                 'daily_person_id': daily_person_id,
                 'daily_exercise_program_id': daily_exercise_program_id,
                 'csrfmiddlewaretoken': '{{ csrf_token }}',
                },
                 type: 'POST',
                 success: function (data) {
                   $('#myTag').attr('val', data.user_exercise_id);
                   }
            }

推荐阅读