IE jQuery问题

Question

HTML：

<div id="media-photo">
    <img src="/uploads/photos/16.jpg" alt="" />
</div>
<a href="/uploads/photos/5.jpg" class="img">
    <img src="/uploads/photos-thumbs/5.jpg" alt="" />
</a>
<a href="/uploads/photos/6.jpg" class="img">
    <img src="/uploads/photos-thumbs/6.jpg" alt="" />
</a>

JQUERY：

$(document).ready(function() {
    $('a.img').click(function() {
        var path = $(this).attr('href');

        $('#media-photo img').attr('src', path);

        return false;
    });
});

解释

上面的代码应该做的是当你点击一个锚点（使用类img）时，＃media-photo div中的图像会根据锚点的href属性变为一个新图像（href是一个它是图像的相对路径，它取代了当前img的src属性。）

它在Firefox中运行良好。

在IE（特别是版本8，我还没有测试旧版本）中，当您点击锚点时，图像会在浏览器中打开，会发生什么。

如何在IE中完成这项工作？

编辑：

我通过使用try {} finally {}来解决问题，以确保函数返回false（以防止默认行为）。这是整个jQuery代码（我已经大大简化了它，而不是让人们混淆不相关的东西）：

$(document).ready(function() {
    $('.box-content2 a.img').click(function() {
        var path = $(this).attr('href');
        var title = $('img', this).attr('alt');
        var description = jQuery.trim($(this).attr('title'));
        var id = $(this).attr('id');

        if (id != $('#media-photo img').attr('id')) {

            try {

                $('#media-photo img').attr('src', path);
                $('#media-photo img').attr('alt', title);
                $('#media-photo img').attr('id', id);

                $('#content h2:first').text('You Are Viewing "' + title + '"');
                $('title').text('You Are Viewing "' + title + '"');

                if (description.length > 0) {
                    $('#content .box-container:first').removeClass('invisible');
                    $('#content .box-container:first p').text(description);
                } else {
                    $('#content .box-container:first').addClass('invisible');
                }

                var action = '/view/favoriting-form/id/' + id;

                $.get(action, function(data) {
                    if ($('.favoriting').length > 0) {
                    $('.favoriting').replaceWith(data);
                    } else {
                        $('#actions h3').after(data);
                    }
                });

                action = '/view/rating-form/id/' + id;

                $.get(action, function(data) {
                    if ($('.rating').length > 0) {
                        $('.rating').replaceWith(data);
                    } else {
                        if ($('.favoriting').length > 0) {
                            $('.favoriting').after(data);
                        } else {
                            $('#actions h3').after(data);
                        }
                    }
                    $('.star').rating();
                });

                action = '/view/add-media-comment/id/' + id;

                $.get(action, function(data) {
                    $.getScript('/js/photo.js');
                    $('#media-comments').html(data);
                });

            } finally {

                return false;
            }

        }

        return false;
    });
    $('#add_to_favorites').hover(function() {
        var id = $('#media-photo img').attr('id');
        var action = '/view/photo/id/' + id;
        $('.favoriting').attr('action', action);
    });
    $('#rate-button').hover(function() {
        var id = $('#media-photo img').attr('id');
        var action = '/view/photo/id/' + id;
        $('.rating').attr('action', action);
    });
    $('a.previous-media, a.next-media').click(function() {
        var id = $('#media-photo img').attr('id');
        var href = $(this).attr('href');
        href = href.split('/');
        var p = href[href.length - 1];
        var url = '/view/album-photos/id/' + id + '/p/' + p;

        $.get(url, function(data) {
            $.getScript('/js/photo.js');
            $('.box-content2').html(data);
        });

        return false;
    });
    $('#media-comments form').submit(function() {
        var id = $('#media-photo img').attr('id');
        var url = '/view/add-media-comment/id/' + id;

        var postData = $(this).serialize() + '&add_comment=Submit';
        $.post(url, postData, function(data) {
            $.getScript('/js/photo.js');
            $('#media-comments').html(data);
        });

        return false;
    });
});

Answer 1

在这一行：

if (id != $('#media-photo img').attr('id')) {

id来自哪里？

Answer 2

嗯，快点试试并告诉我它是否有效：

$(document).ready(function() {
    $('a.img').click(function(ev) {
        var path = $(this).attr('href');

        $('#media-photo img').attr('src', path);
        ev.preventDefault();
        return false;
    });
});