Question

我已经使用Jquery创建了一个函数，当我点击它时更改链接颜色...当我将链接链接到＃（hash）时，代码工作得很好，但是我将它与php混合它将无法正常工作？

这是我的PHP工作得很好：

<?php
    $pages_dir = 'pages';
    if (!empty($_GET['p'])) {
        $pages = scandir($pages_dir, 0);
        unset($pages[0], $pages[1]);
        $p = $_GET['p'];
        if (in_array($p.'.inc.php', $pages)) {
            include($pages_dir.'/'.$p.'.inc.php');
        } else {
            echo '******.';
        }
    } else {
        include($pages_dir.'/hjem.inc.php');
    }
?>

我的HTML中的链接工作得很好：

href="index.php?p=*********"

但现在我想应用一种效果，使我的链接的背景颜色与i OnClick效果的颜色不同：

$(document).ready(function(){
        var $targetElement = $("*** This is to my links ***");
        $targetElement.click(function() {
            $targetElement.removeClass("changeColor")
            $(this).addClass("changeColor");
    });
});

还有一些css：

#****** ul li a:link.changeColor{
    background-color:black;
}

Jquery仅在我将链接转换为＃时工作，我希望它能用我的php代码工作：）

Answer 1

阻止锚元素的默认事件，所以改变：

$targetElement.click(function() {
  $targetElement.removeClass("changeColor")
  $(this).addClass("changeColor");
});

到

$targetElement.click(function(e) {
   e.preventDefault(); 
   //get href tag and load content
   var $this = $(this), href = $this.attr("href"), $that = $this;
   $("#someElementId").load(href, function() {
       $targetElement.removeClass("changeColor")
       $that.addClass("changeColor");
   });
});

你的意思是这样吗

Answer 2

点击链接后，浏览器会重定向到链接的href。

您有两个选择：

1）所有这些都将由AJAX完成 - 您将通过ajax加载所请求页面的内容，然后您将停止传播点击事件，因此浏览器不会重定向。您可以通过从事件处理程序返回false或通过调用e.preventDefault()来完成此操作。

2）使用CSS：

ul li a:active {
    background-color:black;
}

Jquery onClick函数不适用于PHP

2 个答案: