简体   繁体   English

似乎无法让我的jQuery工作

[英]Can't seem to get my jQuery to work

I need another set of eyes on this. 我需要另一组眼光。 When I use jsfiddle everything worked but for some reason I can't get it to operate in Dreamweaver. 当我使用jsfiddle时,一切正常,但由于某种原因,我无法使其在Dreamweaver中运行。 I get no errors or the like. 我没有收到任何错误之类的信息。 I'm going to try again later because it may be that my Dreamweaver is malfunctioning. 我将稍后再试,因为可能是Dreamweaver出现了故障。 Look over the code and tell me what you think please. 查看代码,并告诉我您的想法。 Obviously this is a work in progress. 显然,这是一个正在进行的工作。 The code is below. 代码如下。

HTML HTML

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <link type="text/css" rel="stylesheet" href="Portfolio.css" />
                <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
                <script src="PortfolioControl.js" type="text/javascript"></script>
        <title>Home Page</title>
    </head>

<body>

<!-- CONTENT //-->
    <table align="center" id="navTable">
        <tr>
<!-- NAME AND LOGO //-->
            <td colspan='2' id="titleBar">
            </td>
        </tr>
        <tr>
            <td>
                <div class="navButton">
                    <p>Home</p>
                </div>
            </td>
<!-- RIGHT SIDE //-->
            <td id="rightSide" rowspan='5'>
                <p>replaced on ready</p>
            </td>
        </tr>
        <tr>
            <td>
                <div class="navButton">
                    <p>Art</p>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="navButton">
                    <p>Projects</p>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="navButton">
                    <p>Blog</p>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="navButton">
                    <p>Contact</p>
                </div>
            </td>
        </tr>
    </table>
</body>
</html>

CSS CSS

body {
    background: #000000;
}

/* TITLE */
#titleBar {
    height: 100px;
}

/* DYNAMIC RIGHT SIDE*/
#rightSide {
    width: 620px;
    border-left: 2px solid white;
    padding: 15px;
}

#rightSide p {
    color: #FFFFFF;
}

/* MAIN PAGE TABLE */
#navTable {
    margin-top:200px;
    width: 800px;
    padding: 20px;
    background-color: #000000;
}
#navTable td {
    padding-right: 15px;
}

/* NAV BUTTONS */
.navButton p {
    font-size: 18px;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
    color: #FFFFFF;
}

.navButton p:hover {
    color: #FF7600;
}

Javascript 使用Javascript

 $(document).ready(function() {
    //create a p
    var yay = $('<p>Yay</p>');

    $('rightSide').append(yay);
});

It is because in your jQuery function you have not identified the correct selector for your rightSide element. 这是因为在jQuery函数中,您没有为rightSide元素标识正确的选择器。

jQuery $('') selector works off the same constructs as CSS, therefore you are missing the ID identifier before rightSide. jQuery $('')选择器与CSS具有相同的构造,因此在rightSide之前缺少ID标识符。

$('#rightSide').append(yay);

should work. 应该管用。

Here's the reason it wasn't working... Apparently I needed to download jQuery and use the local file instead of trying to link out to Google. 这是它无法正常工作的原因。显然,我需要下载jQuery并使用本地文件,而不是尝试链接到Google。 I'm pretty sure I've linked out to the Google APIs before so I'm not sure why I couldn't this time. 我很确定之前我已经链接到Google API,所以我不确定为什么这次不能这样做。 Anyway, thank you everyone for your help. 无论如何,谢谢大家的帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM