Question

当我点击手风琴菜单中的其他项目时，我试图在concrete5网站中更改div的背景图像。我是JQuery / Javascript的新手，并且一直使用警报语句来检查我的功能是否正常，并且这些功能正常运行。

我认为这个问题似乎是通过类来引用Div，因为我的代码在点击时根本不会改变背景图像

我已经检查了我的页面的源代码，我试图引用的类肯定是已经设置了背景图像的类，我试图在单击菜单的不同部分时进行交换。

    <div class="ccm-faq-container anitya-accordion faq-accordion">
      <dl>
           <dt class="title" id="title1">
        <a href="">
            Guitar                <i class="fa fa-chevron-down icon"></i>
        </a>
    </dt>
    <dd class="content" style="display: block;">
      <div class="content-inner"><p></p><p>Lessons</p><p></p></div>
    </dd> 
           <dt class="title" id="title2">
        <a href="">
            Bass                <i class="fa fa-chevron-down icon"></i>
        </a>
    </dt>
    <dd class="content" style="display: none;">
      <div class="content-inner"><p></p><p>Lessons</p><p></p></div>
    </dd> 
           <dt class="title" id="title3">
        <a href="">
            Workshops                <i class="fa fa-chevron-down icon"></i>
        </a>
    </dt>
    <dd class="content" style="display: none;">
      <div class="content-inner"><p></p><p>Workshops<span></span></p><p></p>          </div>
    </dd> 
        </dl>
</div>

       <script type='text/javascript'>
      $(function(){ // I use jQuery in this example
         document.getElementById('title1').onclick = 
         function(){
           $("div.ccm-custom-style-main1 grid-overlay").css('background-image', 'url("/application/files/5414/3153/4591/15401266516_84c767391f_k.jpg")')
             };
         document.getElementById('title2').onclick = 
         function () {
           alert('this is title2')
         };
         document.getElementById('title3').onclick = 
         function () {
           alert('this is title3')
           };
       });


   </script>

非常感谢任何帮助:)谢谢！

Answer 1

当我将类名减少到.ccm-custom-style-main1时，所有问题都解决了。

该类的扩展版本（在concrete5中启用了网格覆盖）。

jquery在concrete5类中更改背景图像

1 个答案: