Onclick功能在特定范围内无效

时间:2015-10-19 06:21:20

标签: javascript jquery onclick

我遇到的问题是我的onclick事件正在处理img但不在标签上。 我在php和jquery中创建了一个follow和unfollow函数。它没有工作,所以我决定在点击跟随或取消关注按钮后测试警报。然后它也无法正常工作。 代码就是这个

<?php
if ($my_id != $id) {
    $check_follow_not      = mysqli_query($conn, "SELECT * FROM follower WHERE user_id='$my_id' AND following='$id'");
    $check_follow_not_rows = mysqli_num_rows($check_follow_not);

    if ($check_follow_not_rows == 0) {
        $editfollowunfollow = "<span class='btn_f_uf'><a onclick=\"don();\">Follow</a></span>";
    } else {
        $editfollowunfollow = "<span class='btn_f_uf'><a onclick=\"don();\">UnFollow</a></span>";
    }
} else {
    $editfollowunfollow = "<span class='btn_f_uf'><a>Edit Profile</a></span>";
}
echo $editfollowunfollow;
?>

不要去PHP代码它工作正常它是检查登录用户是否跟随另一个用户以下。问题是我已经插入了无效的onclick功能。

don()函数就是这个

function don(){
    alert();
}

此功能在同一文件中的图像上正常工作。但是没有在跟随和取消关注中工作。

提前致谢。我感谢所有答案

修改

btn_f_uf类的Css代码

.btn_f_uf{
    border:0;
    outline:0;
    padding:10px;
    background:#53a93f;
    border-radius:5px;
    color:white;
    float:right;
    margin-right:20px;
    margin-top:25px;
    display:inline-block;
}

编辑2

个人资料页面整码

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></meta>
    <title>Profcee</title>
    <link rel="stylesheet" href="style/style.css">
    <script src="js/jquery-2.1.3.js"></script>
    <script src="js/check.js"></script>
    <script src="js/jquery-ui.js"></script>
    <script src="js/jquery-ui.min.js"></script>
</head>
<?php 
session_start();
if(isset($_GET['id'])){
        include "function/checklogin.php";
        include "config/connect.php";

        $my_profile_image = $_SESSION['profile_image'];
        $my_email =  $_SESSION['email'];
        $my_id = $_SESSION['id'] ;
        $my_name = ucfirst($_SESSION['name']);
        $my_background_image = $_SESSION['background_image'];

        $id = $_GET['id'];
        $check = mysqli_query($conn,"SELECT * FROM users WHERE id='$id'");
        $check_num = mysqli_num_rows($check);
        if($check_num == 0){
                header("location:home.php");
        }else{
            $fetch = mysqli_fetch_assoc($check);
            $name = ucfirst($fetch['name']);
            $email = $fetch['email'];
            $profile_image = $fetch['profile'];
            $background_image = $fetch['background'];

            if($my_id != $id){ 
                $check_follow_not = mysqli_query($conn,"SELECT * FROM follower WHERE user_id='$my_id' AND following='$id'");
                $check_follow_not_rows = mysqli_num_rows($check_follow_not);

                if($check_follow_not_rows == 0){ 
                    $editfollowunfollow = "<span class='btn_f_uf'><a class='btns'>Follow</a></span>";
                } else{ 
                    $editfollowunfollow = "<span class='btn_f_uf'><a class='btns'>UnFollow</a></span>";
                }
            }else{
                $editfollowunfollow = "<span class='btn_f_uf'><a>Edit Profile</a></span>";
            }
?>
<?php
include "header.php"; ?>
<div id="profile_full">
<div id="background_image">
    <img src="<?php echo $background_image;?>" width="100%" height="400px" onclick="don();">
</div>
<div id="profile_image">
    <img src="<?php echo $profile_image?>" width="250px" height="250px">
</div>
<div id="profile_header">
    <h1><?php echo $name;?></h1>

                    <div id="profile_follower">
                    <?php 
                        $follower = mysqli_query($conn,"SELECT * FROM follower WHERE following='$id'");
                        $follower_count = mysqli_num_rows($follower);
                    ?>
                    <h2><?php echo $follower_count;?> Follower</h2> 
                    </div>
                    <div id="profile_following">
                    <?php 
                        $following = mysqli_query($conn,"SELECT * FROM follower WHERE user_id='$id'");
                        $following_count = mysqli_num_rows($following);
                    ?>
                    <h2><?php echo $following_count;?> following </h2>
                    </div>
                    <?php echo $editfollowunfollow;?>

</div>
</div>
<?php
include "footer.php";
?>
<?php 
}
}else{
    header("location:home.php");
}
?>

check.js文件

$(document).on("click",".btns", function(e){
  e.preventDefault();
  alert();      
});

2 个答案:

答案 0 :(得分:0)

像其他人说的那样,给它类名btns并删除该锚标记上的onclick内联javascript:

.....
if($check_follow_not_rows == 0){ 
   $editfollowunfollow = "<span class='btn_f_uf'><a class='btns'>Follow</a></span>";
} else{ 
   $editfollowunfollow = "<span class='btn_f_uf'><a class='btns'>UnFollow</a></span>";
}
....

在js代码中:

$(document).on("click",".btns", function(e){
  e.preventDefault();
  alert();      
});

如果你想坚持function don(),请使用此(但必须确保删除onclick内联javascript ):

$(document).on("click",".btns", don );

don函数中:

function don(){
  alert();
  return false;
} 

答案 1 :(得分:0)

是的,它已经完成了。问题在于div的定位。所以我从头开始