jQuery onchange select option

Question

假设我有这段 HTML 代码：

<select id='list'>
    <option value='1'>First</option>
    <option value='2'>Second</option>
    <option value='3'>Third </option>
</select> 
<input type ="text" id="text"/>

然后是这段JavaScript代码

 //other variables are also declared here
    var x1 = 5;
    var x2 = 10;
    var value = x1 * x2;
    var list_value =$("#list").change(function() {
             $(this).val();
 // just an example of how i want the function in the variable 
    });
    var nwval = value * list_value;
      $('#text').val(nwval);
// some long piece of code 
// i'm also using the list_value value somewhere in the long piece of code..

我希望当用户选择选项时，文本框中的值能够改变，我知道如果把更改事件包装在它周围，它就会起作用，但是是否有任何方法可以在保留变量list_value的同时完成这个操作？

- user951042

---

http://jsfiddle.net/karim79/BXu26/1/ - user951042

我明白，但这就是我请求帮助的原因 :) - user951042

“@epascarello 只是因为你知道这个，不代表他也知道，所以与其批评他的知识缺乏，不如试着丰富他的知识。” - Joakim

$(selector).change()会将$(selector)返回给你。因此，list_value实际上是你选择的元素。你需要先修改那部分内容。 - spicavigo

谢谢所有回答的人，这里真的有很棒的人。我目前正在尝试他们，之后会再和大家联系。再次感谢。 - user951042

Answer 1

var x1 = 5;
var x2 = 10;
var value = x1 * x2;
var nwval;
$("#list").change(function() {
    nwval = value * $(this).val();
    $('#text').val(nwval);
});

- Manuel van Rijn

Answer 2

$('#text').val($('option:selected').text());
$('#list').change(function(){

        $('#text').val($('option:selected').text());
})

请从这里检查 http://jsfiddle.net/QrHUN/

- Sedat Başar

Answer 3

将change事件封装起来是更好的方式，因为它创建了一个闭包。你可以像下面这样使用全局变量，但是在后面再次获取值会更好（个人意见）。

从技术上讲，你可以这样做（虽然这是一个不好的主意，因为它使用了全局变量）：

var x1 = 5;
var x2 = 10;
var value = x1 * x2;
var list_value = 1;
$("#list").change(function() {
    list_value = $(this).val();
    var nwval = value * list_value;
    $('#text').val(nwval); 
});

- Hailwood

Answer 4

这将返回一个 jQuery 对象，而不是一个值。

var list_value =$("#list").change(function() {  

如果你想要代码外部的值，你需要像这样做。

var list_value = 0;
var sel = $("#list").change(function() {
         list_value = $(this).val();
}).change();
var nwval = value * list_value;
$('#text').val(nwval);

但是 onchange 事件只会更新变量，而不会更新页面！

- epascarello