示例HTML

Question

我有一个选择框，我想要onchange一些我将改变的图像，而其他一些div会改变他们（css：top，right values）我是如何用Jquery做的？

我现在有这个代码（不是在jquery中，它不会改变其他div的顶部，右边......）

<script type="text/javascript">
    function swapImage(){
        var image = document.getElementById("img");
        var dropd = document.getElementById("text");
        image.src = dropd.value;    
    };
</script>

<select id="text" onChange="swapImage()" style="width:70px;">
    <option value="images/1.jpg">1</option>
    <option value="images/2.jpg">2</option>
    <option value="images/3.png">3</option>
</select>

Answer 1

示例HTML

<select id='my-select-box'>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
</select>

javascript使用jQuery

$('#my-select-box').on('change', doStuff());

function doStuff(){
  //change an image
  //move some divs
}

如果您愿意，也可以使用.change() function作为快捷方式。

Answer 2

这是您的html工作（您可以检查图片元素以查看src正在更改）：http://jsfiddle.net/69GNC/1/

$("#text").on("change", function() {
    $("#img").prop("src", $(this).val());
    // you could also add something like this for your other req.:
    // $("#otherDiv").css({"top": "10px", "left": "15px" });
});

注意：在达到此代码时，您需要确保您的dom可以访问，因此您可以将其包装在$document.ready(function() { [code here] });

中

jquery更改图像src和div位置onselect

2 个答案:

示例HTML

javascript使用jQuery