烦人,它每次都可以在jsfiddle上运行,而不是在我的网站上不可用

问题描述 投票:0回答:2

为什么此代码不起作用?我根本听不懂,我花了数小时去做,但仍然找不到我的错误,它可以在jsfiddle上运行,而对我和我的网站则永远不起作用。在jsfiddle jsfiddle

我的代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>My site</title>


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

<script type="text/javascript">
// mouse-on examples
$('#mouseon-examples div').data('powertipjq', $([
    '<p><b>Here is some content</b></p>',
    '<p><a href="http://stevenbenner.com/">Maybe a link</a></p>',
    '<p><code>{ placement: \'e\', mouseOnToPopup: true }</code></p>'
    ].join('\n')));
$('#mouseon-examples div').powerTip({
    placement: 'e',
    mouseOnToPopup: true
});


</script>
</head>

<body>

<div id="mouseon-examples">dfgdg</div>

</body>
</html>

<style type="text/css">
#mouseon-examples div {
    background-color: #EEE;
    text-align: center;
    width: 200px;
    padding: 40px;
}

</style>
jquery web dreamweaver jsfiddle
2个回答
1
投票

您必须在jsfiddle中启用文档onLoad选项(编辑:实际上是您这样做的,],>

如果是这样,则需要将其放入代码中:

$(function(){
$('#mouseon-examples div').data('powertipjq', $([
    '<p><b>Here is some content</b></p>',
    '<p><a href="http://stevenbenner.com/">Maybe a link</a></p>',
    '<p><code>{ placement: \'e\', mouseOnToPopup: true }</code></p>'
    ].join('\n')));
$('#mouseon-examples div').powerTip({
    placement: 'e',
    mouseOnToPopup: true
});
})

-编辑-

似乎您忘记了CSS,请将其添加到html <head>

<link rel="stylesheet" type="text/css" href="http://stevenbenner.github.com/jquery-powertip/styles/jquery.powertip.css">

-编辑-

整个代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>

    <title>My site</title>

    <link rel="stylesheet" type="text/css" href="http://stevenbenner.github.com/jquery-powertip/styles/jquery.powertip.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <script type="text/javascript">
    // mouse-on examples
    $(function(){
        $('#mouseon-examples div').data('powertipjq', $([
            '<p><b>Here is some content</b></p>',
            '<p><a href="http://stevenbenner.com/">Maybe a link</a></p>',
            '<p><code>{ placement: \'e\', mouseOnToPopup: true }</code></p>'
            ].join('\n')));
        $('#mouseon-examples div').powerTip({
            placement: 'e',
            mouseOnToPopup: true
        });
        })


    </script>
<style type="text/css">
    #mouseon-examples div {
        background-color: #EEE;
        text-align: center;
        width: 200px;
        padding: 40px;
    }

    </style>
    </head>

    <body>

    <div id="mouseon-examples">dfgdg</div>

    </body>
    </html>

0
投票
$(document).ready(function(){
    $('#mouseon-examples div').data('powertipjq', $([
        '<p><b>Here is some content</b></p>',
        '<p><a href="http://stevenbenner.com/">Maybe a link</a></p>',
        '<p><code>{ placement: \'e\', mouseOnToPopup: true }</code></p>'
        ].join('\n')));
    $('#mouseon-examples div').powerTip({
        placement: 'e',
        mouseOnToPopup: true
    });
}); 
© www.soinside.com 2019 - 2024. All rights reserved.