Kiểm tra nếu tùy chọn được chọn với jQuery, nếu không chọn mặc định

Sử dụng jQuery, làm thế nào để bạn kiểm tra nếu có một tùy chọn được chọn trong menu chọn và nếu không, chỉ định một trong các tùy chọn như đã chọn.

(Lựa chọn được tạo với một mê cung các chức năng PHP trong một ứng dụng tôi vừa kế thừa, vì vậy đây là một sửa chữa nhanh trong khi tôi đi đầu xung quanh chúng :)

Mặc dù tôi không chắc chắn về chính xác những gì bạn muốn thực hiện, nhưng đoạn mã này đã làm việc cho tôi.

<select id="mySelect" multiple="multiple">
  <option value="1">First</option>
  <option value="2">Second</option>
  <option value="3">Third</option>
  <option value="4">Fourth</option>
</select>

<script type="text/javascript"> 
$(document).ready(function() {
  if (!$("#mySelect option:selected").length) {
    $("#mySelect option[value='3']").attr('selected', 'selected');
  }
});
</script>

Không cần sử dụng jQuery cho việc này:

var foo = document.getElementById('yourSelect');
if (foo)
{
   if (foo.selectedIndex != null)
   {
       foo.selectedIndex = 0;
   } 
}

Câu hỏi này đã cũ và có rất nhiều lượt xem, vì vậy tôi sẽ chỉ ném một số thứ ra đó sẽ giúp ích cho một số người.

Để kiểm tra xem phần tử chọn có bất kỳ mục nào được chọn không:

if ($('#mySelect option:selected').length > 0) { alert('has a selected item'); }

hoặc để kiểm tra xem một lựa chọn không có gì được chọn:

if ($('#mySelect option:selected').length == 0) { alert('nothing selected'); }

hoặc nếu bạn đang ở trong một vòng lặp nào đó và muốn kiểm tra xem phần tử hiện tại có được chọn không:

$('#mySelect option').each(function() {
    if ($(this).is(':selected')) { .. }
});

để kiểm tra nếu một phần tử không được chọn trong vòng lặp:

$('#mySelect option').each(function() {
    if ($(this).not(':selected')) { .. }
});

Đây là một số cách để làm điều này. jQuery có nhiều cách khác nhau để thực hiện cùng một thứ, vì vậy bạn thường chỉ cần chọn cách nào có vẻ hiệu quả nhất.

câu trả lời của lencioni là những gì tôi muốn giới thiệu. Bạn có thể thay đổi bộ chọn cho tùy chọn ('#mySelect option:last')để chọn tùy chọn có giá trị cụ thể bằng cách sử dụng " #mySelect option[value='yourDefaultValue']". Thêm về bộ chọn .

Nếu bạn đang làm việc rộng rãi với các danh sách chọn lọc trên máy khách, hãy xem plugin này: http://www.texotela.co.uk/code/jquery/select/ . Hãy xem nguồn nếu bạn muốn xem thêm một số ví dụ về làm việc với các danh sách được chọn.

Đây là chức năng của tôi thay đổi tùy chọn đã chọn. Nó hoạt động cho jQuery 1.3.2

function selectOption(select_id, option_val) {
    $('#'+select_id+' option:selected').removeAttr('selected');
    $('#'+select_id+' option[value='+option_val+']').attr('selected','selected');   
}

<script type="text/javascript"> 
$(document).ready(function() {
  if (!$("#mySelect option:selected").length)
   $("#mySelect").val( 3 );

});
</script>

Dễ dàng! Mặc định nên là tùy chọn đầu tiên. Làm xong! Điều đó sẽ dẫn bạn đến JavaScript không phô trương, vì JavaScript không cần thiết :)

JavaScript không phô trương

Tôi đã bắt gặp các plugin texotela được đề cập, cho phép tôi giải quyết nó như thế này:

$(document).ready(function(){
    if ( $("#context").selectedValues() == false) {
    $("#context").selectOptions("71");
    }
});

Nhìn vào chỉ số được chọn của selectphần tử. BTW, đó là một thứ DOM đơn giản, không dành riêng cho JQuery.

Đây là một kịch bản nhanh mà tôi thấy đã hoạt động ... .Result được gán cho một nhãn.

$(".Result").html($("option:selected").text());

Các bạn đang làm quá nhiều cho việc lựa chọn. Chỉ cần chọn theo giá trị:

$("#mySelect").val( 3 );

if (!$("#select").find("option:selected").length){
  //
}

Tôi tìm thấy một cách tốt để kiểm tra, nếu tùy chọn được chọn và chọn mặc định khi không.

    if(!$('#some_select option[selected="selected"]').val()) {
        //here code if it HAS NOT selected value
        //for exaple adding the first value as "placeholder"
        $('#some_select option:first-child').before('<option disabled selected>Wybierz:</option>');
    }

Nếu #some_select không có tùy chọn được chọn mặc định thì .val () không được xác định

$("option[value*='2']").attr('selected', 'selected');
// 2 for example, add * for every option

$("#select_box_id").children()[1].selected

Đây là một cách khác để kiểm tra một tùy chọn được chọn hay không trong jquery. Điều này sẽ trả về Boolean (Đúng hoặc Sai).

[1] là chỉ mục của tùy chọn hộp chọn

Thay đổi sự kiện trên hộp chọn để kích hoạt và sau đó, chỉ cần kéo thuộc tính id của tùy chọn đã chọn: -

$("#type").change(function(){
  var id = $(this).find("option:selected").attr("id");

  switch (id){
    case "trade_buy_max":
      // do something here
      break;
  }
});

Tôi chỉ tìm kiếm một cái gì đó tương tự và tìm thấy điều này:

$('.mySelect:not(:has(option[selected])) option[value="2"]').attr('selected', true);

Điều này tìm thấy tất cả các menu chọn trong lớp chưa có tùy chọn được chọn và chọn tùy chọn mặc định ("2" trong trường hợp này).

Tôi đã thử sử dụng :selectedthay vì [selected], nhưng nó không hoạt động vì thứ gì đó luôn được chọn, ngay cả khi không có thuộc tính nào

Nếu bạn cần kiểm tra rõ ràng từng tùy chọn để xem liệu có thuộc tính "được chọn" nào không, bạn có thể làm điều này. Nếu không, option:selectedbạn sẽ nhận được giá trị cho tùy chọn mặc định đầu tiên.

var viewport_selected = false;      
$('#viewport option').each(function() {
    if ($(this).attr("selected") == "selected") {
        viewport_selected = true;
    }
});