jQuery选择选定的值未定义

Question

我遇到了这一行代码的问题：var value = $("#opstina option:selected").val(); ，但只有在Chrome浏览器中我得到了undefined的值。在FireFox和IE中，它正常工作，只有在Chrome中我得到了这个警告。有人知道原因吗？HTML代码是：

<select id="opstina" name="opstina">
      <option value="0">Izaberite Mesto</option>
      <option value="1" selected="selected">Novi Sad-grad 1</option>
     <option value="2">Beograd-Stari Grad</option>
</select>

这是我的jQuery代码。

if ($("#drzava option:selected").length) {
                    $("select#opstina").attr("disabled","disabled");
                    $("select#opstina").html("<option>wait...</option>");
                    var id = $("select#drzava option:selected").attr('value');
                        $.post("select_opstina.php", {id:id}, function(data){
                        $("select#opstina").removeAttr("disabled");
                         alert( "html koji bi trebao biti upisan u select:\n\n" + data );
                        $("select#opstina").html(data);
            });
                        if ($("#opstina option:selected").length) {
                        alert('Došao sam pred petlju');
                         var value = $("#opstina option:selected")[0].value;
                         alert(value);
                        var sel = $("#opstina").val();
                        if (sel!=0) {
                              alert('Ušao sam u petlju, i selektovano polje za opštinu je' + sel );
            $("select#mesto").attr("disabled","disabled");
            $("select#mesto").html("<option>wait...</option>");
            var id= $("select#opstina option:selected").attr('value');
            alert(id);
            $.post("select_mesto.php", {id:id}, function(data){
                alert("html koji bi trebao biti upisan u select:\n\n" + data );
                $("select#mesto").removeAttr("disabled");
                $("select#mesto").html(data);
            });
        }
    }

                } 
}

- Thug

Answer 1

以下代码应该在所有浏览器中都可以正常工作：

$('#drzava').find(":selected").val();   //tested in Chrome, safar, FF.

此外，您的下拉框不支持多选，因此您可以使用以下代码：

$('#drzava').val(); //For multi-select too this work. In that case it gives you array of values.

- Rakesh Juyal

Answer 2

对我来说有效，您也可以使用DOM对象的值，您可以使用索引器将其转换为DOM对象或使用获取函数

演示

$("#opstina option:selected")[0].value;
$("#opstina option:selected").val()

- Adil

---

但我需要的是值，而不是从选择中获取的文本。 - Thug

这个完美运行，$("#opstina option:selected").val()。 - Ashwin Balani

Answer 3

我很困惑，因为：

$('#opstina').on('change', function(){
    alert (  $('#opstina option:selected').val()  );
});

工作：http://jsfiddle.net/Vm3qu/

并且选择了基础：http://jsfiddle.net/Vm3qu/1/

- BENARD Patrick

---

我不需要改变，它是预先选择的。在此之前，我有一个if ($("#opstina option:selected").length)来检查是否已选择，这很好，只是该值未定义，让我感到疯狂。 - Thug

你能看一下 http://jsfiddle.net/Vm3qu/2/ 吗？在我的 Chromium 和 Chrome 上，'' alert( $('#opstina option:selected').val() ); '' 提醒我所选的值... [否则请原谅我完全不理解 :'( ] - BENARD Patrick

好的，我看了你的例子，我知道它应该可以工作，但在我的网站上以某种方式出现了未定义的情况。只有在Chrome浏览器中出现这种情况。其他浏览器上它是如何工作的，但在Chrome上却不行？ - Thug

Answer 4

试试这个，它会帮助你的。

   $("#opstina").change(function(){
        var value = $(this).val();// Value of selected option
        var Text = $(this).val();// Text of selected option
        alert('Value: '+value);
        alert('Text:' +Text);
    });

在这里试试看 这里

- S. S. Rawat

Answer 5

我几年后也遇到了和你一模一样的问题 :) 这听起来很奇怪，但是对我来说做这个简单的更改就可以解决问题！！ 我必须使用不同的id和name值。
将 select id="opstina" name="opstina" 更改为 select id="opstina" name="其他名称"

此后，你的 $("#opstina option:selected").val() 就能正常工作了。

- mrana