Question

我是jQuery的新手，我试图通过从src HTML标记获取链接来切换图片select属性。

这是我正在使用的选择HTML：

<select id="pages">
  <option value="Manga/Naruto/Friends/01.png">1</option>
  <option value="Manga/Naruto/Friends/02.png">2</option>
  <option value="Manga/Naruto/Friends/03.png">3</option>
  <option value="Manga/Naruto/Friends/04.png">4</option>
</select>

这是我试图用来切换图片src属性的jQuery脚本：

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $("#pages").change(function(){
    $('#greatphoto').attr('src', val());
    //.val());
  }); 
</script>

这是我要切换的图片的占位符：

<div id="mangaImages">
  <img id="greatphoto" src="Manga/Naruto/Friends/01.png" />
</div> <!-- end of mangaImages -->

对此的任何帮助将不胜感激。

Answer 1

您可以尝试

$(this).val()

而不是

val()

Answer 2

这样做：

$(function() {
   $("#pages").change(function(){
      $('#greatphoto').attr('src', this.value); // Could use $(this).val() too.
   });
});

使用$(function() {...});包装代码可确保在运行之前加载DOM。这是调用jQuery的.ready()方法的快捷方式。

现在您的<select>没有收到change事件，因为它在代码运行时尚不存在。

使用选择切换图像

2 个答案: