Cara menghapus/mengubah JQuery UI Autocomplete Pembantu teks?

Aku tahu ini telah asnwered tapi hanya ingin memberikan sebuah contoh implementasi:

var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++"
    ];

$("#find-subj").autocomplete({
    source: availableTags,
    messages: {
        noResults: 'no results',
        results: function(amount) {
            return amount + 'results.'
        }
    }
});

Ini digunakan untuk aksesibilitas, cara mudah untuk menyembunyikan hal ini dengan CSS:

.ui-helper-hidden-accessible { display:none; }

Atau (lihat Daniel's komentar di bawah)

.ui-helper-hidden-accessible { position: absolute; left:-999em; }

Atas jawabannya di sini mencapai efek visual yang diinginkan, tetapi mengalahkan objek jQuery memiliki ARIA dukungan, dan sedikit dickish untuk pengguna yang bergantung pada hal itu! Orang-orang yang've disebutkan bahwa jQuery CSS menyembunyikan ini untuk anda benar, dan ini adalah gaya yang artinya:

.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

Salin itu ke stylesheet anda bukan menghapus pesan, silakan :).

Menurut blog ini:

sekarang Kita gunakan ARIA hidup daerah untuk mengumumkan ketika hasil telah tersedia dan bagaimana untuk menavigasi melalui daftar saran. Pengumuman dapat dikonfigurasi melalui pesan pilihan, yang memiliki dua sifat: noResults ketika tidak ada barang yang dikembalikan dan hasil ketika setidaknya salah satu item yang dikembalikan. Secara umum, anda hanya akan perlu untuk mengubah ini pilihan jika anda ingin string yang akan ditulis dalam bahasa yang berbeda. pesan opsi ini dapat berubah di masa depan versi saat kita bekerja pada sebuah solusi lengkap untuk manipulasi string dan internasionalisasi di semua plugin. Jika anda tertarik dalam pesan pilihan, kami mendorong anda untuk membaca sumber; yang relevan kode ini di bagian paling bawah dari autocomplete plugin dan hanya beberapa baris.

...

Jadi bagaimana ini berlaku untuk autocomplete widget? Nah, sekarang ketika anda pencarian untuk item, jika anda memiliki screen reader akan membaca anda sesuatu seperti "1 hasil tersedia, gunakan up dan down tombol panah untuk menavigasi.". Keren, kan?

Jadi, jika anda pergi ke github dan melihat autocomplete source code, di sekitar garis 571 anda'll melihat di mana hal ini benar-benar dilaksanakan.

Menambahkan jquery css juga bekerja untuk menghapus teks instruksional.

Karena ini adalah di sana untuk alasan aksesibilitas it's mungkin yang terbaik untuk menyembunyikannya dengan CSS.

Namun, saya akan menyarankan:

.ui-helper-hidden-accessible { position: absolute; left: -9999px; }

Daripada:

.ui-helper-hidden-accessible { display:none; }

Sebagai mantan akan menyembunyikan item off-layar, tapi masih memungkinkan pembaca layar untuk membacanya, sedangkan display:none tidak.

Nah, pertanyaan ini sedikit lebih tua, tapi teks ini tidak muncul di semua bila anda termasuk sesuai file css:

Tentu saja anda harus menyisipkan tema sebenarnya bukan YOUR_THEME_HERE misalnya "kehalusan"

Gaya itu bagaimana jQuery tema sendiri gaya itu. Banyak jawaban yang lain menyarankan termasuk seluruh stylesheet, tetapi jika anda hanya ingin yang relevan CSS, ini adalah bagaimana it's dilakukan dalam http://code.jquery.com/ui/1.9.0/themes/smoothness/jquery-ui.css:

.ui-helper-hidden-accessible { 
    position: absolute !important; 
    clip: rect(1px 1px 1px 1px); 
    clip: rect(1px,1px,1px,1px);
}

Untuk menambahkan kode ini tepat setelah autocomplete dalam naskah anda akan mendorong menjengkelkan penolong dari halaman, tetapi orang-orang yang menggunakan pembaca layar masih akan mendapatkan keuntungan dari itu:

$(document).ready(function() { //pushing the autocomplete helper out of the visible page
    $(".ui-helper-hidden-accessible").css({"position": "absolute", "left":"-999em"}) //{"display","none"} will remove the element from the page
});

I'm bukan penggemar memanipulasi CSS dengan JS, tapi dalam kasus ini saya pikir itu masuk akal. Kode JS menciptakan masalah di tempat pertama, dan masalah ini akan diselesaikan beberapa baris berikut di file yang sama. IMO ini lebih baik dari pemecahan masalah di file CSS terpisah yang mungkin bisa diedit oleh orang lain yang don't tahu mengapa .ui-helper-tersembunyi-dapat diakses oleh kelas itu dimodifikasi dengan cara itu.

JQuery CSS .ui-helper-tersembunyi-dapat diakses di themes/base/inti.file css. Anda harus menyertakan file ini (minimal) dalam stylesheet untuk maju kompatibilitas.