使用jquery获取所选元素的值

Why does this not work:

为什么这不起作用:

HTML:

<img src='picture.jpg'>
<select name='blah[0]' onchange='changePicture();'>
  <option value='default.jpg'>Default</option>
  <option value='somethingelse.jpg'>A picture</option>
</select>

Javascript:

function changePicture()
{
  $(this).siblings("img").attr("src",$(this).val());
}

3 个解决方案

#1

Modify your Javascript function to accept a parameter:

修改您的Javascript函数以接受参数:

function changePicture(tag)
{
  $(tag).siblings("img").attr("src",$(this).val());
}

Your HTML will call the function passing it 'this':

你的HTML会调用函数传递'this':

<img src='picture.jpg'>
<select name='blah[0]' onchange='changePicture(this);'>
  <option value='default.jpg'>Default</option>
  <option value='somethingelse.jpg'>A picture</option>
</select>

#2

First you're not passing a reference to the select element in your code, so this has no value in your function. To do that, you'd do something like onchange='changePicture(this);', but I'm not recommending that.

首先,您没有在代码中传递对select元素的引用,因此这在您的函数中没有任何价值。要做到这一点,你会做像onchange ='changePicture(this);'这样的事情,但我不推荐这样做。

Since you're using jQuery you should use jQuery's event handling like this:

既然你正在使用jQuery,你应该像这样使用jQuery的事件处理:

$('select[name="blah[0]"]').change(function(){
    $(this).siblings("img").attr("src", $(this).val());
})

jsFiddle example

#3

$(function() {
  $("#select").change(function() {
    var src = $("#select").val(); /* value of the current selected option */
    
    $("#img").prop("src", src);
    
    alert($("#img").prop("src"));
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<img id = "img" src='picture.jpg'>
<select id = "select" name='blah[0]' onchange='changePicture();'>
  <option value = "picture.jpg">Default Picture</option>
  <option value='default.jpg'>Default</option>
  <option value='somethingelse.jpg'>A picture</option>
</select>

I added 2 ids, img to identify the image, and select to identify the select. I used .change() JQuery function which is triggered when <option> is changed. I take the value of the <option> selected, and change the src of the image.

我添加了2个ID,img用于识别图像,并选择识别选择。我使用了.change()JQuery函数,当

#1