Question

我正在网上搜索使用Jquery立即加载图像的方式，但我没有找到任何东西。为此，我想使用：

<select>
       <option>Image 1</option>
       <option>Image 2</option>
       <option>Image 3</option>
</select>

所以基本上我想在点击其中一个选项后立即加载A图像。我该怎么做？谢谢。

EDIT 点击其中一个选项后我会加载图片，而不刷新页面

Answer 1

这是一个简单的例子：

＆＃13;

// When an option is selected
$('#imageSelect').on('change',function(){
    // Change the image's src to the selected value
    $('#myImage').attr('src', $(this).val());
  // Do it once on page load if necessary
}).change();

＆＃13;

img{display:block;max-width: 50%;} /* Just for the demo */

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id="imageSelect">
       <option value="http://i62.tinypic.com/2088l0l.jpg">Image 1</option>
       <option value="http://i58.tinypic.com/2rfv4b6.jpg">Image 2</option>
       <option value="http://i62.tinypic.com/9a7nk4.jpg">Image 3</option>
</select>

<!-- Your image holder -->
<img src="" id="myImage" alt="" />

＆＃13;

使用jquery加载即时图像

1 个答案: