Question

我正在尝试实现与this类似的功能。

图片将来自Feed网址，我不确定如何防止它们在新窗口中打开，这是我到目前为止所拥有的：

使用Javascript：

的jquery / 1.3.2 / jquery.min.js

<script type="text/javascript">
    jQuery(function($){
        $('#more-views a').click(function(){
            $('#main-image img').fadeOut('slow').delay(2000).remove();
            //$('#main-image').append('&lt;img src="' + $(this).attr('href') + '" alt="" style="display:none;" /&gt;');

            $('#main-image').append('<img src="' + $(this).attr('data') + '" alt="" style="display:none;" />');
            $('#main-image img').fadeIn('slow');
            return false;
        });
    });
</script>

HTML

<div id="more-views">
    <a data="http://www.domain.com/image1.jpg"> 1 Day</a>
    <a data="http://www.domain.com/image2.jpg"> 5 Days</a>
    <a data="http://www.domain.com/image3.jpg"> 1 Month</a>
</div>


<div id="main-image">
    <img src="http://www.domain.com/image1.jpg" alt="1d" />
</div>

请帮忙！谢谢！

Answer 1

尝试在JavaScript中添加一行以进行测试，看看它是否会添加段落标记。如果是这样，您可能会对图像的网址产生问题，而不是使用此处的代码。

jQuery(function($){
    $('#more-views a').click(function(){
        $('#main-image p').fadeOut('slow').delay(2000).remove();
//-------v add this line for testing
        $('#main-image').append('<p>' + $(this).attr('href') + '</p>);

        $('#main-image').append('<img src="' + $(this).attr('href') + '" alt="" style="display:none;" />');
        $('#main-image p').fadeIn('slow');
        return false;
    });
});

==少旧==

好的，我想我现在明白你的问题。不要让<a>标记具有href属性，而是使用data属性。

所以你的锚标签应该是这样的：

<a data='domain.com/image1.jpg'>image1</a>

然后你需要替换两条JavaScript行：

$('#main-image').append('&lt;img src="' + $(this).attr('href') + '" alt="" style="display:none;" /&gt;');

变为：

$('#default-market-chart').append('<img src="' + $(this).attr('data') + '" alt="" style="display:none;" />');

并且，您必须使用#main-image替换JavaScript中#default-market-chart的所有实例，因为您似乎没有main-image

==旧==

尝试将<和>替换为<和>，以便您的网页将您提供的字符串视为HTML标记，而不是只是一个字符串。

在div里面的JQuery图像交换

1 个答案: