Chosen: iPad: Tidak dapat menutup/menghapus li.search-choice (acara `click.chosen` tidak pernah diaktifkan)

Dibuat pada 4 Des 2018 · 5Komentar · Sumber: harvesthq/chosen

Langkah-langkah untuk mereproduksi

Akses https://harvethq.github.io/chosen/ melalui iPad. Juga dapat direproduksi melalui "Toggle device toolbar" di Chrome Console dan kemudian memilih perangkat "iPad".
Di bawah "Pilihan ganda", tambahkan elemen.
Sekarang - tanpa mengklik di tempat lain - klik "x" untuk menghapus elemen yang ditambahkan. Tidak ada yang terjadi.

Perilaku yang diharapkan

li.search-choice elemen harus dihapus. select.chosen-select option harus dibatalkan pilihannya.

Perilaku sebenarnya

li.search-choice elemen tetap. select.chosen-select option terus dipilih. Acara chosen.click tidak pernah menyala.

Lingkungan

Versi Terpilih : 1.8.7 (di situs web Terpilih) dan ~1
jQuery atau Versi Prototipe : 3.2.1 (di situs web Terpilih) dan 2.1.4 dan 2.2.4
Browser dan Versi : Chrome, versi 70.0.3538.110 (Build Resmi) (64-bit)
OS dan Versi : Windows 10, versi 1709, OS Build 16299.492

Informasi tambahan

Solusi yang berfungsi di browser (melalui "Toggle device toolbar" di Konsol), tetapi tidak sedikit pun intuitif, adalah:

Pilih elemen dari menu yang sedang dibuka sehingga elemen li.search-choice ditambahkan. Perhatikan: Mengklik "x" masih tidak menghasilkan apa-apa.
Klik di tempat lain di situs web; yaitu di luar bidang yang dipilih.
Klik bidang yang dipilih sehingga menu pencarian terbuka.
Sekarang "x" dapat diklik pada elemen yang ditambahkan sebelumnya dan mengkliknya dengan benar akan menghapus elemen tersebut.

Ini sepertinya tidak berfungsi pada iPad fisik yang sebenarnya.

Pikiran

Tampaknya klik bahkan tidak diinisialisasi pada waktunya ketika elemen ditambahkan.

Memindai kode Javascript yang Dipilih dengan cepat, saya melihat bahwa peristiwa inti berikut - sehubungan dengan mengklik - sedang ditangani:

mousedown
mousemove
mouseup
touchstart
touchmove
touchend

Yang tidak saya lihat adalah penanganan acara untuk:

pointerdown
pointermove
pointerup

Mungkin ini memiliki pengaruh pada masalah ini?

Bug iOS

Sumber

kafoso

👍1

Semua 5 komentar

Dapat mengonfirmasi bahwa (setidaknya di Chrome yang berpura-pura menjadi iPad) Anda tidak dapat membatalkan pilihan item dari multi-pilih. Mengetuk X tidak menghasilkan apa-apa.

tjschuck pada 4 Des 2018

Saya menemukan masalah yang sama.

Saya menemukan bahwa jika Anda akan fokus keluar dari bidang pilihan (bukan hanya bidang penutup, tetapi sebenarnya fokus pada elemen lain), tombol X masih tidak berfungsi. Tetapi Anda akan fokus pada bidang ini lagi (dan menampilkan drop-down), sekarang Anda berhasil menghapus opsi.

Segera setelah Anda menutup dropdown, sekali lagi, X tidak berfungsi.

Saya dapat mereproduksi ini di emulator chrome dan perangkat fisik.

durbanski pada 14 Des 2018

hanya untuk memperjelas. Dengan keluar dari elemen Anda perlu membuat .chosen-container untuk menjatuhkan kelas chosen-container-active . Ketika chosen-container-active dihapus dari chosen-container dan diterapkan lagi dengan fokus baru, ini berfungsi dengan baik saat ini.

durbanski pada 14 Des 2018

Oke, saya tidak yakin apa sebenarnya masalah di sini, tapi saya membuatnya bekerja untuk saya.

Pertama saya menggunakan opsi ini saat menginisialisasi:

el.chosen({
    display_selected_options: false,
    hide_results_on_select: false,
});

Untuk beberapa alasan yang dipilih adalah memblokir interaksi apa pun dengan kontrol saat Anda tidak fokus pada bidang.

Saya menemukan bahwa ketika Anda mengklik bidang luar results_hide dipanggil, dan metode ini sepenuhnya memblokir bidang dari mengakses (setidaknya di ponsel/tablet). Jadi saya mencari cara untuk mencegah perilaku ini.

Tampaknya menyetel flag results_showing ke false menyebabkan bug ini.

Chosen.prototype.results_hide = function() {
  if (this.results_showing) {
    this.result_clear_highlight();
    this.container.removeClass("chosen-with-drop");
    this.form_field_jq.trigger("chosen:hiding_dropdown", {
      chosen: this
    });
  }
  // removed because of mobile issue with removeing options
  // return this.results_showing = false;
};

Menghapusnya dari sumber (tidak nyaman, tetapi tidak ada pilihan lain sekarang), harus berhasil.

Saya tidak yakin apa yang sebenarnya dilakukan ini, tetapi saat ini saya tidak melihat adanya efek samping.

durbanski pada 14 Des 2018

👍1

Saya baru saja menonaktifkan yang dipilih untuk semua perangkat seluler dan tablet. Tidak tahu apakah antarmuka pilih sentuh bawaan lebih ramah pengguna daripada kotak input yang dipilih. Hanya kehilangan opsi pencarian, tetapi tetap terasa aneh pada perangkat sentuh.

Baris 590:

    AbstractChosen.browser_is_supported = function() {
      if ("Microsoft Internet Explorer" === window.navigator.appName) {
        return document.documentMode >= 8;
      }
      if (/iP(od|hone)/i.test(window.navigator.userAgent) || /IEMobile/i.test(window.navigator.userAgent) || /Windows Phone/i.test(window.navigator.userAgent) || /BlackBerry/i.test(window.navigator.userAgent) || /BB10/i.test(window.navigator.userAgent) || /Android.*Mobile/i.test(window.navigator.userAgent)) {
        return false;
      }
      if ((/iPhone|iPod|iPad|Android|android|playbook|silk|BlackBerry/).test(navigator.userAgent))
      {
        return false;
      }
      if (/Android/i.test(window.navigator.userAgent)) {
        if (/Mobile/i.test(window.navigator.userAgent)) {
          return false;
        }
       }
       return true;
     };

Bersulang
Hannes