Question

我的jQuery代码的最后一行不能用于未知原因，它必须替换我的div面板中的'内容'块（ panel-body ）来自变量的新字符串“My New Awesome Content”（ var content =“My New Awesome Content”; ）。如果有人帮我澄清我的代码发生了什么以及为什么它不起作用？我感谢任何帮助！

<script>
    $(function() {
        var content = "My New Awesome Content";

        $('.panel-button').on('click', function() { 
            var panelId = $(this).attr('data-panelid');
            $('#'+panelId).toggle();
            **$('#'+panelId+'.panel-body').html(content);**

        });
    });
</script>

Answer 1

您正在尝试选择标识为panelId且类为panel-body的元素，并且jQuery会返回一个空列表，因此不会发生任何事情。

在.panel-body之前留一个空格，这样您就可以选择一个内容为panel-body 的元素一个ID为panelID的元素：

$('#' + panelId + ' .panel-body').html(content);

注意

如果您只想定位具有特定ID的div panel-body的直接孩子，则必须使用>选择器或使用children()方法：

CSS选择器

$('#' + panelId + ' > .panel-body').html(content);

<强>子（）

$('#' + panelId + '').children('.panel-body').html(content)

Answer 2

您跳过元素及其子元素之间的空格：

$('#'+panelId+' .panel-body').html(content);

您正在进行的操作将在panelId中设置过滤器，以选择具有panel-body类的过滤器。

jquery .html（）;不替换文本块

2 个答案: