Chọn các phần tử có id lạ

Question

Tôi đang làm việc trên hệ thống cũ sử dụng dấu ngoặc vuông trong thông số id. Ví dụ:

<select id="mySelect[]"> 
    <option value="1">Yadda</option> 
    <option value="2">Yadda</option> 
    <option value="3">Yadda</option> 
</select> 

jQuery (là JavaScript) khá đúng phàn nàn khi tôi cố gắng sử dụng id này trong, nói,

$("#mySelect[]").append(options); 

Với thực tế là tôi không thể thay đổi mã di sản và do đó tôi bị mắc kẹt với id hiện tại (có thể hoặc có thể không hợp lệ trong bất kỳ ngữ cảnh nào), điều gì sẽ là một cách hay để làm việc xung quanh mớ hỗn độn này và để tôi chọn các phần tử của mình?

Answer 1

Hãy thử cách này:

$("#mySelect\\[\\]").append(options); 

Bạn cần phải thoát khỏi [ và ] vì chúng được dành riêng chars jquery được sử dụng trong bộ chọn.

Có một cái nhìn tại jquery docs

To use any of the meta-characters (such as !"#$%&'()*+,./:;<=>?@[]^`{|}~) as a literal part of a name, it must be escaped with with two backslashes: \. For example, an element with id="foo.bar", can use the selector $("#foo\.bar").

và fiddle here

Thêm ofcourse bạn có thể làm điều này $('[id="mySelect[]"]') Nhưng vì nó là một hiệu suất selector thuộc tính khôn ngoan này sẽ chậm hơn và bạn mất lợi thế của việc sử dụng bộ chọn id, nhưng tiện dụng nếu bạn không có cách nào để thoát khỏi các ký tự.

Answer 2

Trong khi sử dụng ký tự meta, bạn phải loại bỏ các ký tự đó.

$("#mySelect\\[\\]").append(options); 

Jquery selector docs saying that

To use any of the meta-characters (such as !"#$%&'()*+,./:;<=>?@[]^`{|}~) as a literal part of a name, it must be escaped with with two backslashes: \.

Nếu bạn không muốn để thoát khỏi nó, bạn có thể sử dụng bộ chọn

$(document.getElementById('mySelect[]') 

Answer 3

Hãy thử jsfiddle link này.

Cả hai tác phẩm dưới đây tốt:

console.log($('[id^=mySelect]')); 
console.log($('#mySelect\\[\\]'));