javascript - jQuery - .on ('click' ) 不在 <li> 上工作

Question

所以我的任务是使用 Wordpress 制作一个网站，主页上有一个 slider ，如果您单击下面的按钮，它会显示另一张图片，很简单吧？好吧，我有 slider 和按钮，我已经添加了 jQuery 但它不想工作。

我首先尝试将按钮制作成真正的按钮:

<button type="button" class="btn btn-success" id="hideshow-healthcare">Healthcare</button>

当我使用它时效果很好:

    jQuery(document).ready(function() {
    jQuery('#hideshow-healthcare').on('click', function() {
        jQuery('#healthcare').show();
    };
};

所以在让它像这样工作之后，我开始将按钮制作成 li 的，这样我就可以遵循设计。这样做后， slider 不再起作用。我尝试了多种不同的方法，包括将 ID 添加到 li 中的所有内容以查看是否可行，但遗憾的是不行。我做了一些研究并试图改变

    jQuery('#hideshow-healthcare').on('click', function() {

到

    jQuery('li#hideshow-healthcare').on('click', function() {

但是，仍然没有运气。我希望有人能够为这个问题提供解决方案。

此外，这是我目前使用的 li 代码:

<li><a id="hideshow-healthcare"><h5>HEALTHCARE</h5> Lighting to create a feeling of well being</a></li>

Answer 1

您需要在 li 元素后添加空格以找到其后代 #hideshow-healthcare。应该是

 jQuery('li #hideshow-healthcare').on('click', function() {