Question

出于某种原因，我认为我的javascript实际上无法“连接”或链接到我的HTML页面。我甚至尝试将javascript放在我的html代码中，但我真的不知道实际上是什么错误。

继承我的代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="description" content="practice">
<meta name="keywords" content="practice">
<title>Practice</title>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery_regular.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/jquery.backstretch.min.js"></script>
<script type="text/javascript" src="js/top_javascript.js"></script>
<script type="text/javascript" src="js/jquery_rollover.js"></script>
<script type="text/javascript" src="js/jquery_slideout.js"></script>
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" href="stylesheet/top_style.css" type="text/css" media="all">
<link rel="shortcut icon" href="favicon.ico" />


</head>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("about").hover(function(){
    $("about").css("background-color","yellow");
    },function(){
    $("about").css("background-color","pink");
  });
});
</script>

    <body onLoad="fontSizeChg(0);">
        <div id="top_wrapper">
            <!-- Maint  -->
            <div id="top_main_box">
            <div id="slide">
                <!-- Main left -->
                <div id="top_main_l_box">
                    <!-- Main left logo -->
                    <div id="top_main_logo"><img src="image/title.png" alt=""></div>

                    <!-- Main left Navi -->
                    <ul id="top_main_navi_1">
                        <li id="about"> ABOUT </li>
                        <li><a><img src="image/member.png" alt="" class="rollover"></a></li>
                        <li><a><img src="image/photo.png" alt="" class="rollover"></a></li>
                        <li><a><img src="image/links.png" alt="" class="rollover"></a></li>
                        <li><a><img src="image/contact.png" alt="" class="rollover"></a></li>
                    </ul>



                </div>
                <div id="about_this">
                        This is all the things about our page
                </div>

Answer 1

您需要使用#按id定位元素：

$(document).ready(function(){
    $("#about").hover(function(){
        $(this).css("background-color","yellow");
    },function(){
        $(this).css("background-color","pink");
    });
});

另外，你只需要包含一次jQuery，目前你已经加载了两次，所以你可以删除它：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">

Answer 2

您正在尝试引用about元素。哪个不存在。因此，您需要将该代码更改为以下内容：

<script>
$(document).ready(function(){
  $("#about").hover(function(){
    $("#about").css("background-color","yellow");
    },function(){
    $("#about").css("background-color","pink");
  });
});
</script>

Answer 3

试试这个 -

<script>
$(document).ready(function(){
  $("#about").hover(function(){
    $("#about").css("background-color","yellow");
    },function(){
    $("#about").css("background-color","pink");
  });
});
</script>

Answer 4

试试这个你有错误的身份

$(document).ready(function(){


$("#about").hover(function(){

$("#about").css("background-color","yellow");
},function(){

$("#about").css("background-color","pink");
  });
});

Javascript无法处理我的代码？

4 个答案: