Javascript jqzoom使用选择框更改图像

我试图用选择框在简单的jqzoom文件中更改图像。 当我从选择框中选择任何选项时，该选项的图像会发生变化 下面是标准代码

<div class="clearfix" id="content" style="margin-top:100px;margin-left:350px; height:500px;width:500px;" >
    <div class="clearfix">
        <a id="bigImage" href="imgProd/triumph_big1.jpg" class="jqzoom" rel='gal1'  title="triumph11" >
            <img src="imgProd/triumph_small1.jpg"  title="triumph"  style="border: 4px solid #666;">
        </a>
    <select style="position:absolute;left:800px;top:120px;">
    <option>test 1</option>
    <option>test 2</option>
    <option>test 3</option>
  </select>


    </div>
    <br/>
 <div class="clearfix" >
    <ul id="thumblist" class="clearfix" >
        <li><a class="zoomThumbActive" href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './imgProd/triumph_small1.jpg',largeimage: './imgProd/triumph_big1.jpg'}"><img src='imgProd/thumbs/triumph_thumb1.jpg'></a></li>
        <li><a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './imgProd/triumph_small2.jpg',largeimage: './imgProd/triumph_big2.jpg'}"><img src='imgProd/thumbs/triumph_thumb2.jpg'></a></li>
        <li><a  href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './imgProd/triumph_small3.jpg',largeimage: './imgProd/triumph_big3.jpg'}"><img src='imgProd/thumbs/triumph_thumb3.jpg'></a></li>
    </ul>
    </div>

测试1
测试2
测试3

当我从下拉框中选择test1时，图像1将显示等等，我该怎么做

非常感谢