$(this）.html 在 jquery 中不起作用

$(this).html not working in jquery

本文关键字：jquery 不起作用 html this      更新时间：2023-09-26
<globemedia id="1"></globemedia>
<script type="text/javascript">
        $("globemedia").each(function(index, value) {
            var globeIDxMedia = $(this).attr("id");
            $.get("getmedia.jsp?mediaID="+globeIDxMedia,function(a){
                $(this).html(a);
            });
        });
</script>

我用来将内容加载到我的自定义标签的上述脚本说<getmedia id="1"></getmedia>

脚本工作正常，直到从页面 getMedia 获取数据.jsp但是当我使用 $(this).html(a); 它不会加载数据时。

从jquery论坛得到答案它也适用于自定义标签

<script type="text/javascript">
        $(document).ready(function(){
            $("div[data-globalmedia]").each(function(index, value) {
                var globeIDxMedia = $(this).attr("id");
                $(this).load("getmedia.jsp?mediaID="+globeIDxMedia);
            });
        });
</script>

jQuery专家给了我你必须使用的解决方案$(document).ready(function(){});它就像一个魅力

保留对$.get()函数之外$(this)的引用。

<script type="text/javascript">
    $("globemedia").each(function(index, value) {
        var globeIDxMedia = $(this).attr("id");
        var self = $(this);
        $.get("getmedia.jsp?mediaID="+globeIDxMedia,function(a){
            $(self).html(a);
        });
    });
</script>

this的含义在$.get的回调中与在外部$().each的回调中不同。您可以在此处阅读有关this语义的更多信息：http://www.sitepoint.com/javascript-this-gotchas/

通常，如果要在回调函数中引用this的"外部"值，首先必须将其绑定到可在回调中访问的变量（在本例中，我使用了名为 self 的变量的通用约定）。

你不能

this（指的是globemedia）$.get()回调函数范围内。在$.get()回调函数中，this引用其他内容，但不引用globemedia。

因此，获取$.get()之外的this引用，其中引用globalmedia如下所示：

      $("globemedia").each(function(index, value) {
            var globeIDxMedia = $(this).attr("id");
            // keep referece to this
            // ie. globemedia
            var media = $(this);
            $.get("getmedia.jsp?mediaID="+globeIDxMedia,function(a){
                // here self refers to
                // globemedia element
                media.html(a);
            });
        });

注意

我认为$("globemedia")应该是$(".globemedia").这意味着您应该使用class选择器。

您无法创建自己的自定义 HTML 标记。看这里

由于您无法创建自己的HTML标记（此处为globalmedia），因此您可以使用data属性来代替它们。例如：

<div data-globalmedia="media1" id="id_1">Media 1</div>
<div data-globalmedia="media2" id="id_2">Media 2</div>

等等。对于jQuery，你可以使用：

$('[data-globalmedia]').each(function() {
    var globeIDxMedia = $(this).attr("id");
    // keep referece to this
    // ie. globemedia
    var self = $(this);
    $.get("getmedia.jsp?mediaID=" + globeIDxMedia, function(a) {
        // here self refers to
        // globemedia element
        self.html(a);
    });
});

工作样品

相关文章：