Cách kiểm tra xem hộp chọn có trống không bằng cách sử dụng JQuery/Javascript

Question

Sử dụng JQuery Mobile Tôi có một hộp chọn được điền động từ cơ sở dữ liệu. Tính đến thời điểm hiện tại, dân số của hộp kiểm này đang hoạt động hoàn hảo. Tôi đã thêm chức năng bao gồm một nút gọi một chức năng thông qua sự kiện 'khi nhấp'. Công việc của hàm này là để biết liệu hộp kiểm cụ thể này có được điền hay không; nếu nó không có thì nó sẽ đơn giản là không làm bất cứ điều gì, nhưng nếu không nó sẽ chạy trơn tru. Vấn đề của tôi là xác định xem hộp chọn này có trống hay không.

Dưới đây là một ví dụ rất đơn giản về những gì tôi đang đối phó với:

<li> 
    <label for="fruit_name">Fruit</label> 
    <select name="some_fruit" id="fruit_name" onclick="populate_box('fruit', this);"> 
    </select> 
</li> 

chức năng của tôi, được gọi từ một nút riêng biệt, trông như thế này:

function isSelextBoxEmpty(selectBoxId) { 
    var selected_value = $('#fruit_name'); 

    /* More options... still testing the proper way: 
    var selected_value = $('#fruit_name').text; 
    var selected_value = $('#fruit_name').value; 
    var selected_value = $('#fruit_name').length; 
    var selected_value = $('#fruit_name option:selected', this); 
    var selected_value = document.getElementById('fruit_name'); 
    var selected_value = document.getElementById('fruit_name').length; 
    var selected_value = document.getElementById('fruit_name').value; 
    var selected_value = document.getElementById('fruit_name').innerHTML; 
    */ 

    if(selected_value) { 
     alert("NOT null, value: " + selected_value); 
     //do something 
    } 
    else { 
     alert("null, value: " + selected_value); 
     //do something 
    } 
} 

Đừng lo lắng về điều này và nó hoạt động như thế nào. Ngay bây giờ những gì quan trọng với tôi là tôi không thể kiểm tra xem hộp kiểm có trống không, tôi chỉ không chắc chắn làm thế nào để đi về nó. Tôi đã đọc rất nhiều thông qua diễn đàn và tài liệu nhưng có nhiều ý nghĩa trong việc làm điều này vì nó phụ thuộc vào việc thực hiện chính nó.

Ví dụ sử dụng document.getElementById(...)... sẽ không nhất thiết phải trả về false và tùy thuộc vào cách bạn sử dụng. Cũng sử dụng $("#someID")... trong jQuery có thể hoặc không thể tạo ra kết quả mong muốn. Tôi đã thử nhiều lần khác nhau như bạn có thể thấy trong các dòng ghi chú đã nhận xét, tất cả đều có thể được đánh giá trong tuyên bố if(...).

Bạn có bất kỳ đề xuất hoặc ý tưởng nào về cách thực hiện điều này không? Cảm ơn trước!

Answer 1

Để kiểm tra xem chọn hộp có bất kỳ giá trị:

if($('#fruit_name').has('option').length > 0) { 

Để kiểm tra giá trị đã chọn có trống không:

if(!$('#fruit_name').val()) { 

Answer 2

Một cách chính xác để chọn giá trị sẽ là

var selected_value = $('#fruit_name').val() 

Và sau đó bạn nên làm

if(selected_value) { ... } 

Answer 3

Một cách chính xác để có được giá trị được lựa chọn sẽ được sử dụng selector này:

$("option[value="0"]:selected") 

tốt nhất dành cho bạn!