Question

我正在尝试按照这些教程http://jsfiddle.net/huanlin/mgvrc/和http://rvera.github.io/image-picker/#

开发图像搜索器

这是我到目前为止尝试过的代码

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Try Image Picker</title>
  <link rel="stylesheet" type="text/css" href="image-picker.css" />
  <link rel="stylesheet" type="text/css" href="style.css" />
  <script type="text/javascript" src="image-picker.js"/> </script>
  <script type="text/javascript" src="image-picker.min.js"/> </script>
  <script>
    $(document).ready(function () {
      $("#selectImage").imagepicker({
        hide_select: true
      });

      var $container = $('.image_picker_selector');
      // initialize
        $container.imagesLoaded(function () {
          $container.masonry({
            columnWidth: 30,
            itemSelector: '.thumbnail'
          });
        });
    });

  function myFunction() {
      document.getElementById("demo").innerHTML = "Paragraph changed.";
  }
  </script>
</head>

<body>
    <select id="selectImage" class="image-picker">
        <option value=""></option>
        <option data-img-src="o.png" value="1">  Image 1  </option>
        <option data-img-src="aa.png" value="2">  Image 2  </option>
        <option data-img-src="ee.png" value="3">  Image 3  </option>
    </select>
<br>
<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>

</body>
</html>

但浏览器中没有显示任何图片。所有CSS，JS脚本和图像都已正确链接。你能说出我在这里做错了什么吗？

Answer 1

这是jQuery插件。我发现你的html头中没有它了。

JQuery Image Picker无法正常工作

1 个答案: