当您从 ajax 调用添加 html 时，html 标记“data-url”不起作用

问题描述

我从标题中知道它可能非常令人困惑，所以让我解释一下。

在这个页面上，我有这样的东西：

  <div id="district_courses">
                    <?PHP foreach ($courses as $course) {
                        if ($course->group_type == 'D') {  ?>
                            <div id="course_nav_<?PHP echo $course->id; ?>" class="menu-item course" data-url="<?PHP echo base_url('/admin/uploads/course/' . $course->id); ?>">
                                <div><?PHP if ($isdistrict == TRUE) {
                                            echo $course->title . " <sapn style='font-size: 12px;'>(" . $course->pub_name . ")</span>";
                                        } else {
                                            echo $course->title;
                                        } ?></div>
                            </div>
                    <?PHP }
                    } ?>
                </div>

工作正常，单击元素时 data-url 处于活动状态。但是，现在有一个搜索功能，我可以在其中抓取数据并将其放在页面上的空 div 中

<div id="searched_courses">
                </div>

这是获取搜索数据的ajax调用。如您所见，我在 javascript 中循环结果，然后将代码放入上面的 div 中，但现在似乎使用此代码数据 url 处于非活动状态。我无法点击元素并运行数据 url？

$("#search_courses").click(function() {
    var searchquery = $('#course_search_input').val();
    $.ajax({
        type: "POST",url: '/admin/uploads/course-search',data: {
            query: searchquery
        },success: function(response) {
            var courses = response.courses;
            var i;
            var html = '';
            for (i = 0; i < courses.length; i++) {
                //console.log(courses[i]['id']);
                html += '<div id="course_nav_' + courses[i]['id'] + '" class="menu-item course" data-url="/admin/uploads/course/' + courses[i]['id'] + '"> \
                        <div>' + courses[i]['title'] + ' <sapn style="font-size: 12px;">(' + courses[i]['pub_name'] + ')</span></div> \
                    </div>';
            }


            $('#super_district_courses').hide();
            $('#district_courses').hide();
            $('#school_courses').hide();
            $('#all_courses').hide();
            document.getElementById("searched_courses").innerHTML = html;
            
        },error: function(XMLHttpRequest,textStatus,errorThrown) {
            console.log("Error: " + errorThrown);
        }
    });
});

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

ajax data-uri jquery