Question

我正在学习JQuery，我为我的主页编写了一个简单的AJAX外部脚本，试图从单独的html文件加载一些静态标记，当我将鼠标悬停在链接上时将其插入我的主页...

$(function()
{
    $('a#contact_link').hover(function() 
    {
        alert('test1'); 
        $('<div id="contact_container">').load('contact.htm #contact', function() 
        {
            alert('test2');
            /*$(this) + '</div>';
            $(this).hide()
                .insertAfter('#header')
                .slideDown(1000)  */  
        });

        return false;
    });
});

此时，我只是试图让'test2'警告框显示，这就是为什么我有下面的代码注释掉了。目前，'test1'警告框是唯一显示的警告框，这意味着'test2'警报线永远不会被击中。你的想法？

这是我的contact.htm文件中的代码片段......

<div id="contact_container">
    <div id="contact">
        <p>
        <strong>NAME</strong>: My Name<br/>
        <strong>EMAIL</strong>: My Email<br/>
        <strong>SKYPE</strong>: My Skype Handle<br/>
        <strong>ADDRESS</strong>: My Address<br/>
        </p>        
    </div><!--end contact-->
</div><!--end contact_container-->

非常感谢您的帮助！

Answer 1

您使用错误的选择器语法调用$ .load，选择器不是HTML字符串，它必须符合jQuery Selectors manual设置的语法规则：

$('a#contact_link').hover(function() 
    {
        alert('test1'); 
        $('div#contact_container').load('contact.htm #contact', function() 
        {
            alert('test2');
            /*$(this) + '</div>';
            $(this).hide()
                .insertAfter('#header')
                .slideDown(1000)  */  
        });

        return false;
    });

Answer 2

选择器可能是原因。

$(function()
{
    $('a#contact_link').hover(function() 
    {
        alert('test1'); 
        $('#contact_container').load('contact.htm', function() 
        {
            alert('test2');
            /*$(this) + '</div>';
            $(this).hide()
                .insertAfter('#header')
                .slideDown(1000)  */  
        });

        return false;
    });
});

Answer 3

我相信你的#contact_container选择器不太合适。查看JQuery站点上的选择器doco（http://docs.jquery.com/Selectors）。我觉得这样的事情可能会好一些：

$(function()
{
$('a#contact_link').hover(function() 
{
    alert('test1'); 
    $('#contact_container').load('contact.htm #contact', function() 
    {
        alert('test2');
        /*$(this) + '</div>';
        $(this).hide()
            .insertAfter('#header')
            .slideDown(1000)  */  
    });

    return false;
});
});

Noobie Jquery问题 - 为什么这个简单的脚本不起作用？

3 个答案: