Firefox bỏ qua tùy chọn đã chọn = “đã chọn”

Nếu bạn thay đổi trình đơn thả xuống và làm mới trang, Firefox dường như bỏ qua thuộc tính đã chọn.

<option selected="selected" value="Test">Test</option>

Trên thực tế, nó sẽ chọn tùy chọn bạn đã chọn trước đó (trước khi làm mới). Điều này kết thúc là một vấn đề đối với tôi vì có một sự kiện được kích hoạt trên menu thả xuống làm thay đổi những thứ khác. Có cách nào để khiến firefox dừng hành vi này (ngoài việc kích hoạt một sự kiện khác khi tải trang) không?

AFAIK, hành vi này được mã hóa cứng vào Firefox.

Bạn có thể thử đặt từng phần tử biểu mẫu thành phần tử của nó defaultValuekhi tải trang.

Thêm autocomplete="off"thuộc tính HTML vào mỗi thẻ được chọn. (nguồn: https://stackoverflow.com/a/8258154/260080 )

Điều này khắc phục hành vi ODD trong FireFox.

Trong firefox, tôi nhận thấy rằng thuộc tính "đã chọn" sẽ không hoạt động trừ khi bạn đặt vùng chọn bên trong biểu mẫu, nơi biểu mẫu có thuộc tính tên.

Chỉ gặp vấn đề tương tự, hãy tin tôi đã hơn 10 giờ vật lộn với hành vi firefox ngu ngốc này, tôi có 7 trình đơn thả xuống, mỗi mục trong số chúng sẽ kích hoạt một sự kiện và điền vào 24 đầu vào ẩn, vì vậy bạn có thể tưởng tượng có tùy chọn phù hợp được chọn với 24 giá trị đầu vào sai !!! giải pháp cuối cùng tôi tìm thấy là đặt lại biểu mẫu bằng Javascript thêm dòng mã này:

window.onload = function() { document.forms['MarkerForm'].reset(); };

PS: các đầu vào có các giá trị được lấy từ cơ sở dữ liệu, vì vậy việc đặt lại biểu mẫu không làm trống bất kỳ giá trị nào nhưng theo một cách nào đó, nó sẽ yêu cầu firefox quay trở lại tùy chọn đã chọn = đã chọn!

Nó chỉ là Firefox ghi nhớ lựa chọn trước đó của bạn khi làm mới. Thay vào đó, hãy thử làm mới.

Ngoài ra, vấn đề tương tự ở đây: https://stackoverflow.com/a/1505693/1069232

Cũng xem tại đây: https://bugzilla.mozilla.org/show_bug.cgi?id=274795

Cố gắng tắt autocompletethuộc tính của đầu vào được chọn ... đôi khi trình duyệt bỏ qua selectvì điều đó

Tôi đang sử dụng FF 25.0.1

Nó bỏ qua selected=""và selected="selected".

Nhưng nếu tôi chỉ đơn giản là thử selectedtùy chọn được chọn.

Hành vi kỳ lạ (không tuân thủ). Tôi biết selectedlà HTML5 hợp lệ và đó là dạng ngắn nhất, nhưng tôi thường viết mã cũng xác thực như XML được định dạng tốt, vì vậy tôi có thể sử dụng bất kỳ công cụ xác thực XML nào để kiểm tra kết quả của mình theo cách rất nghiêm ngặt (và việc trao đổi dữ liệu rất dễ dàng .. .)

Theo W3C, các biến thể này phải hợp lệ trên các thuộc tính boolean:

HTML5:  boolAttr="" | boolAttr="boolAttr" | boolAttr
XHTML5: boolAttr="" | boolAttr="boolAttr"

Tôi thích cái đầu tiên hơn, vì nó gần bằng biến thể cuối cùng (không phải xml) nhưng phải xác thực là cả XHTML5 VÀ HTML5. Vì vậy, tôi hy vọng, Mozilla sẽ sửa chữa nó!

sử dụng .prop () thay vì .attr ()

This does not work in firefox.
  $( 'option[value="myVal"]' ).attr( 'selected', 'selected' );
use this one
  $( 'option[value="myVal"]' ).prop( 'selected', 'selected' );

In other way
  $( this ).prop( 'selected', 'selected' );

Bạn có thể gọi .reset()vào biểu mẫu trước khi làm mới trang.

bao gồm thuộc tính select in form và nó sẽ hoạt động.

<!-- will not work in firefox -->
<option selected="selected" value="Test">Test</option>

và

<!-- this will work in firefox -->
<form>
 <option selected="selected" value="Test">Test</option>
</form>

Với cái tên thì hay hơn = >>

form id="UMForm" name="UMForm" class="form"

Lựa chọn sẽ lấy thuộc tính đã chọn

Có thể đó là một lỗi trong mozilla nhưng hãy thử đặt tên cho danh sách thả xuống.

tự động điền cũng không hoạt động cho tôi.

Đây là bản sửa lỗi javscript được viết bằng jquery mà tôi sử dụng:

$('input[type="radio"][selected]').click();

<option selected="selected" value="Test">Test</option>

Trong trường hợp này, điều này hoạt động cho cả Chrome và Firefox.

$('option[value="Test"]').prop('selected', true);

Tôi đã sử dụng .attr()thay vì.prop()

Để hiển thị mục đầu tiên của danh sách thả xuống, hãy sử dụng ProjectName.ClearSelection();

Đặt các dòng trong trang thiết kế của bạn để hoạt động trên tất cả các trình duyệt Và cũng đặt điều này vào mã phía sau khi tải trang.

$(document).ready(function () {
    $("#content_ProjectName option[value='1']").prop("selected", true);
});

Nếu bạn thay đổi lựa chọn và làm mới trang firefox sẽ khôi phục các thay đổi của bạn trên biểu mẫu, đó là lý do tại sao bạn cảm thấy như lựa chọn không hoạt động. Thay vì làm mới, hãy thử mở liên kết trên một tab mới.

Đây là giải pháp của tôi:

var select = document.getElementById('my_select');
for(var i=0; i < select.options.length; i++){
    select.options[i].selected = select.options[i].attributes.selected != undefined;
}

Tôi chỉ đặt nó ở đầu trang (với bộ id thích hợp), và nó phù hợp với tôi. Thay thế getElementById bằng một vòng lặp trên tất cả các lựa chọn trên trang, tôi để lại như một bài tập cho người đọc;).

Đối với tôi không có giải pháp nào ở trên hoạt động. Tôi phải đặt lựa chọn rõ ràng nếu không có lựa chọn nào được đặt:

if (foo.find(':selected').length === 0) {
    $(foo.find('option')[0]).attr('selected', 'selected');
}

Tôi ước firefox sẽ sửa lỗi này :(

Tại nơi làm việc, tôi vừa sửa một lỗi trong đó tùy chọn hộp chọn hiển thị đúng trong Chrome nhưng không hiển thị đúng trong Firefox, trên cùng một trang web. Nó hóa ra là một cái gì đó hoàn toàn khác với các vấn đề ở trên, nhưng có thể là một vấn đề bạn đang gặp phải.

Trong Chrome, màu phông chữ của hộp chọn là màu đen. Vì một số lý do trong Firefox, hộp chọn kế thừa màu chữ từ vùng chứa, màu trắng. Sau khi tôi thêm quy tắc CSS để buộc màu phông chữ của hộp chọn đó là màu đen, bộ giá trị đã được hiển thị chính xác.

Không autocomplete="off"hoặc đặt nó bên trong một formtác phẩm cho tôi.

Điều hiệu quả là chỉ sử dụng thuộc tính đã chọn không có "giá trị" như sau:

<option @(Model.Source == TermSource.Instagram ? "selected" : "")>
    Instagram
</option>
<option @(Model.Source == TermSource.Facebook ? "selected" : "")>
    Facebook
</option>

vì vậy nó hiển thị <option selected>...</option>hoặc chỉ<option>...</option>