0

我有一个带有以下代码的 jQuery 文件：

    ;(function($) {

    $.fn.randomImage = function(options) {
        return this.each(function() {
            var defaults = {images: [
                '<a href="page1.html">Asia<br><img src="https://lh6.googleusercontent.com/-CMBwAQFvgmc/ULwxL0ciUfI/AAAAAAAAAA8/RhaVA3N_TKM/s720/Asia.JPG" height=125 width=200></a>',
                '<a href="page2.html">Africa<br><img src="https://lh6.googleusercontent.com/-LZx9rZ_N7ZQ/ULwyGe1sOPI/AAAAAAAAABE/8iQpB5O7yys/s720/Africa.jpg" height=125 width=200></a>',
                '<a href="page3.html">America<br><img src="https://lh4.googleusercontent.com/-22FSGLZPiMU/ULwy2XZWWHI/AAAAAAAAABM/JgxWMAtQiuM/s800/Central America.JPG" height=125 width=200></a>']};
            var settings = $.extend(defaults, options || {});
            $(this).html(settings.images[Math.floor(Math.random() * settings.images.length)]);
        });
    };
})(jQuery);

我在我的 HTML 文件中引入了以下行：

<script type="text/javascript" src="RandomPictures.js"></script>

我有一个 HTML 文件来调用 Jquery。我想把它称为一个div。

我该怎么打电话？

我试过了：

 <div id="header"><script>
$(function() {
      $('div').randomImage();
});</script></div>

但这隐藏了我的 HTML 代码中的所有元素，只显示图像。

我也试过：

 <div id="header"><script>
$(function() {
      $('header').randomImage();
});</script></div>

但随机图像没有出现。

有什么建议吗？

4

1 回答 1

0

对于第二个代码块，您需要#在选择器中以 id 为目标：

$('#header').randomImage();

对于第一块代码，我不确定您期望发生什么。您的代码编写方式，它会查找所有div标签并将innerHTML每个标签设置div为您的随机图像（这可能会清除您页面的内容）。这就是编写代码的目的。您可能应该只针对您想要随机图像的特定 div，而不是页面中的所有 div。

另外，randomImage的定义以：

$.fn.randomImage = ...

不需要等待文档准备好，如果定义代码在您尝试使用它之前没有运行，这甚至可能导致问题。它只需要在加载 jQuery 之后应用，您可以通过脚本的加载顺序来完成。

于 2012-12-18T04:10:20.217 回答