Question

一个菜鸟，但知道足够危险。我正在使用一个非常简单的Wordpress网站，并创建了这个特色工作库部分，除了一个问题之外工作正常：如果用户意外点击了瓷砖背后的背景，一切都会消失。亲眼看看：

我知道为什么会发生这种情况，因为我已将此部分构建为一个功能，该行为在网站的其他部分首选（参见＆＃34;我们是谁＆＃ 34;部分）。我希望能够做的是禁用后台作为此特定部分的活动链接。该特定部分的代码如下。我希望我可以将某些内容应用于禁用该背景的开头

标记吗？或者我将不得不深入挖掘其他文件？我对JQuery不太满意，所以希望能以某种方式在这段代码中完成。提前致谢！

 <ul id="list-members">
    <?php

        //The Query
        $items = get_posts('cat=6');
        $count = count($items);
        $cnt = 0;
        //The Loop
        if ( $count > 0 ) : foreach($items as $item) : 
            setup_postdata($item);
            $custom_values = get_post_meta($item->ID, 'position', true);

        ?>
  <li>
                <div class="entry-content">
                    <div class="entry-content-col1">

                        <div class="list-detail">
                        <?php the_content();?>
                        </div>    
                  </div>

                </div>
            </li>
        <?php
            $cnt++;
        endforeach;
        endif;
    ?>
    </ul>

Answer 1

在custom JS文件中，有一个使用选择器#list-members的函数。这适用于＆＃34;我们是谁＆＃34;部分，但在你的＆＃34;我们做什么＆＃34;部分，相同的选择器是目标。我建议使用另一个选择器，它只出现在＆＃34;我们做什么＆＃34;部分。尝试更改第120行的选择器，使其更加具体。

$('#post-6 #list-members li').on('click', function(){
    var arrow = $(this).find('.entry-content-arrow');
    if( $(this).find('.toggle-down').length > 0 ) {
        $(this).find('.list-info').slideUp('slow');
        $(this).find('.list-detail').slideDown(500, function(){
            arrow.removeClass('toggle-down').addClass('toggle-up');
            changeInteriorH(2);
            if($(this).find('p:first').is(':empty')){
                $(this).find('p:first').remove();
            }
        });

    } else {
        $(this).find('.list-info').slideDown('fast');
        $(this).find('.list-detail').slideUp(500, function(){
            arrow.removeClass('toggle-up').addClass('toggle-down');
            changeInteriorH(2);
        });
    }
});

对于您的CSS更改： 看起来有两种CSS样式暗示该区域是可点击的。在style.css的第887行，您将看到

#list-members li:hover { 
 background-color: #4D3A2B; 
}

你需要更加具体，就像我们对你的JS一样。试试

#post-6  #list-members li:hover { 
  background-color: #4D3A2B; 
}

为您的选择器。在同一文件的第860行更改

#list-members li, 
#list-partners li {

到

#post-6 #list-members li, 
#post-6 #list-partners li{

以便光标不会显示在背景上。

我不确定为什么你改变了上面JS功能的延迟，但这就是为什么事情变慢了。这不是必要的，可能没有帮助。

如果我的答案解决了您的问题，请进行投票。谢谢！

Answer 2

每当发生类似“点击”的事件时，您都可以收听它，检查有关它的信息，然后根据信息的内容采取一些措施。由于您已经在使用jQuery，请查看API docs for the jQuery Event object - 如果您设置了一个侦听器来查找它，那么所有这些信息都可以使用。

对于您的特定页面，几乎肯定有更优雅的解决方案，但一种直接的方法是听取相关区域的点击并防止该事件传播。

因此，对于一个非常基本的解决方案，请加载您的页面并将其输入JS控制台：

听取您希望“窒息”的元素内的点击次数
当发生该事件时，通过对传递给处理函数的事件对象调用.preventDefault（）来阻止它传播。

$("ul#list-members .entry-content-col1").click(function (e) { 
  e.preventDefault(); 
  return false;
});

上述解决方案并不是很好，因为它针对多个领域。如果您可以为标记添加一些特殊性，例如给出您关注的唯一类或ID名称的区域，则可以更有效地定位它。

需要禁用部分的超链接背景

2 个答案: