Saya menggunakan pernyataan berikut untuk membuatnya menjadi hanya baca tetapi tidak berfungsi.

$('#cf_1268591').attr("readonly", "readonly"); 

Saya tidak ingin menonaktifkannya, saya ingin membuatnya hanya untuk dibaca.

$('#cf_1268591').attr("disabled", true); 

drop down selalu hanya untuk dibaca. yang dapat Anda lakukan adalah membuatnya dinonaktifkan

jika Anda bekerja dengan formulir, bidang yang dinonaktifkan tidak terkirim, jadi gunakan bidang tersembunyi untuk menyimpan nilai tarik-turun yang dinonaktifkan

Saya memiliki masalah yang sama, solusi saya adalah menonaktifkan semua opsi yang tidak dipilih. Sangat mudah dengan jQuery:

$('option:not(:selected)').attr('disabled', true);

Edit => Jika Anda memiliki beberapa dropdown pada halaman yang sama, nonaktifkan semua opsi yang tidak dipilih pada pilih-ID seperti di bawah ini.

$('#select_field_id option:not(:selected)').attr('disabled', true);

Inilah yang Anda cari:

$('#cf_1268591').attr("style", "pointer-events: none;");

Bekerja seperti pesona.

Coba yang ini .. tanpa menonaktifkan nilai yang dipilih ..

$('#cf_1268591 option:not(:selected)').prop('disabled', true);

Ini bekerja untuk saya ..

Saya akan membuat lapangan dinonaktifkan. Kemudian, saat formulir dikirim, buat agar tidak dinonaktifkan. Menurut saya, ini lebih mudah daripada harus berurusan dengan bidang yang tersembunyi.

//disable the field
$("#myFieldID").prop( "disabled", true );           

//right before the form submits, we re-enable the fields, to make them submit.
$( "#myFormID" ).submit(function( event ) {
    $("#myFieldID").prop( "disabled", false );
});     

Menyetel elemen dengan disabledtidak akan mengirimkan data, namun selectelemen tidak memiliki readonly.

Anda dapat mensimulasikan readonlytentang selectpenggunaan CSS untuk penataan dan JS untuk mencegah perubahan dengan tab:

select[readonly] {
  background: #eee;
  pointer-events: none;
  touch-action: none;
}

Kemudian gunakan seperti:

var readonly_select = $('select');
$(readonly_select).attr('readonly', true).attr('data-original-value', $(readonly_select).val()).on('change', function(i) {
    $(i.target).val($(this).attr('data-original-value'));
});

Hasil:

  // Updated 08/2018 to prevent changing value with tab
$('a').on('click', function() {
var readonly_select = $('select');
$(readonly_select).attr('readonly', true).attr('data-original-value', $(readonly_select).val()).on('change', function(i) {
	$(i.target).val($(this).attr('data-original-value'));
});
});

select[readonly] {
  background: #eee;
  pointer-events: none;
  touch-action: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#">Click here to enable readonly</a>
<select>
<option>Example 1</option>
<option selected>Example 2</option>
<option>Example 3</option>
</select>

Jquery sederhana untuk menghapus opsi yang tidak dipilih.

$('#your_dropdown_id option:not(:selected)').remove();

Untuk menyederhanakan, berikut adalah plugin jQuery yang melakukannya tanpa kerumitan: https://github.com/haggen/readonly

Baris ini membuat pemilihan dengan readonlyatribut hanya-baca:

$('select[readonly=readonly] option:not(:selected)').prop('disabled', true);

Kode ini pertama-tama akan menyimpan pilihan asli di setiap dropdown. Kemudian jika pengguna mengubah pilihan itu akan mengatur ulang dropdown ke pilihan aslinya.

http://jsfiddle.net/4aHcD/22/

//store the original selection
$("select :selected").each(function(){
    $(this).parent().data("default", this);
});

//change the selction back to the original
$("select").change(function(e) {
    $($(this).data("default")).prop("selected", true);
});

Opsi termudah bagi saya adalah membuat pilih sebagai hanya-baca dan menambahkan:

onmousedown="return false" onkeydown="return false"

Anda tidak perlu menulis logika tambahan apa pun. Tidak ada masukan tersembunyi atau dinonaktifkan dan kemudian diaktifkan kembali saat pengiriman formulir.

Ini adalah artikel lama, tetapi saya ingin memperingatkan orang-orang yang akan menemukannya. Hati-hati dengan atribut yang dinonaktifkan dengan elemen yang didapat dengan nama. Aneh tapi sepertinya tidak terlalu berhasil.

ini tidak berhasil:

<script language="JavaScript">
function onChangeFullpageCheckbox() {    
$('name=img_size').attr("disabled",$("#fullpage").attr("checked"));
</script>

pekerjaan ini:

<script language="JavaScript">
function onChangeFullpageCheckbox() {    
$('#img_size').attr("disabled",$("#fullpage").attr("checked"));
</script>

Ya, saya tahu bahwa sebaiknya saya menggunakan prop dan bukan attr, tetapi setidaknya sekarang prop tidak akan berfungsi karena versi lama jquery, dan sekarang saya tidak bisa memperbaruinya, jangan tanya kenapa ... perbedaan html hanya ditambahkan id:. ..

<select name="img_size" class="dropDown" id="img_size">
<option value="200">200px
</option><option value="300">300px
</option><option value="400">400px
</option><option value="500">500px
</option><option value="600" selected="">600px
</option><option value="800">800px
</option><option value="900">900px
</option><option value="1024">1024px
</option></select>

<input type="checkbox" name="fullpage" id="fullpage" onChange="onChangeFullpageCheckbox()" />

...

Saya belum menemukan kesalahan pada skrip, dan pada versi dengan nama, tidak ada kesalahan pada konsol. Tapi tentu saja itu bisa jadi kesalahan saya dalam kode

Terlihat di: Chrome 26 di Win 7 Pro

Maaf untuk tata bahasa yang buruk.

Saya telah menemukan, cara yang lebih baik untuk melakukan ini adalah dengan menggunakan CSS untuk menghapus pointer-event dan mengubah opacity pada drop down (coba 0.5). Ini memberi kesan kepada pengguna bahwa itu dinonaktifkan seperti biasa, tetapi masih memposting data.

Memang ini memiliki beberapa masalah dengan kompatibilitas ke belakang, tetapi menurut saya merupakan pilihan yang lebih baik daripada mengatasi masalah nonaktif / hanya baca yang mengganggu.

Anda juga dapat menonaktifkannya dan pada saat Anda membuat panggilan kirim, aktifkan. Saya pikir adalah cara termudah :)

Ini bekerja dengan sangat baik

$('#cf_1268591 option:not(:selected)').prop('disabled', true);

Dengan ini saya dapat melihat opsi tetapi saya tidak dapat memilihnya

Tidak ada yang namanya drop-down hanya baca. Yang dapat Anda lakukan adalah menyetel ulang ke nilai pertama secara manual setelah setiap perubahan.

$("select").change(function(event) {
    $(this).val($(this).find("option").first().val());
});

http://jsfiddle.net/4aHcD/

Cobalah untuk membuat string kosong saat "menekan tombol"

Htmlnya adalah:

<input id="cf_1268591" style="width:60px;line-height:16px;border:1px solid #ccc">

Jquery adalah:

$("#cf_1268591").combobox({
  url:"your url",
  valueField:"id",
  textField:"text",
  panelWidth: "350",
  panelHeight: "200",
});

// buat setelah keyup dengan string kosong

var tb = $("#cf_1268591").combobox("textbox");
  tb.bind("keyup",function(e){
  this.value = "";
});

Mungkin Anda bisa mencoba cara ini

function myFunction()
{
   $("select[id^=myID]").attr("disabled", true);
   var txtSelect = $("select[id^=myID] option[selected]").text();
}

Ini menetapkan nilai pertama dari drop-down sebagai default dan tampaknya hanya untuk dibaca

html5 mendukung:

`
     $("#cCity").attr("disabled", "disabled"); 
     $("#cCity").addClass('not-allow');

`

Berikut adalah sedikit variasi dari jawaban lain yang menyarankan penggunaan orang cacat. Karena atribut "disabled" sebenarnya dapat memiliki nilai apa pun dan tetap menonaktifkan, Anda dapat menyetelnya ke readonly, seperti disabled = "readonly". Ini akan menonaktifkan kontrol seperti biasa, dan juga akan memungkinkan Anda untuk dengan mudah menatanya secara berbeda dari kontrol yang dinonaktifkan biasa, dengan CSS seperti:

select[disabled=readonly] {
    .... styles you like for read-only
}

Jika Anda ingin data dimasukkan, kirim, gunakan bidang tersembunyi atau aktifkan sebelum mengirim, seperti yang dijelaskan di jawaban lain.

Seperti yang dikatakan @Kanishka, jika kami menonaktifkan elemen formulir, itu tidak akan dikirimkan. Saya telah membuat cuplikan untuk masalah ini. Saat elemen pemilihan dinonaktifkan, ini membuat bidang input tersembunyi dan menyimpan nilainya. Jika diaktifkan, hapus field input tersembunyi yang dibuat.

Info lebih lanjut

jQuery(document).ready(function($) {
  var $dropDown = $('#my-select'),
    name = $dropDown.prop('name'),
    $form = $dropDown.parent('form');

  $dropDown.data('original-name', name); //store the name in the data attribute 

  $('#toggle').on('click', function(event) {
    if ($dropDown.is('.disabled')) {
      //enable it 
      $form.find('input[type="hidden"][name=' + name + ']').remove(); // remove the hidden fields if any
      $dropDown.removeClass('disabled') //remove disable class 
        .prop({
          name: name,
          disabled: false
        }); //restore the name and enable 
    } else {
      //disable it 
      var $hiddenInput = $('<input/>', {
        type: 'hidden',
        name: name,
        value: $dropDown.val()
      });
      $form.append($hiddenInput); //append the hidden field with same name and value from the dropdown field 
      $dropDown.addClass('disabled') //disable class
        .prop({
          'name': name + "_1",
          disabled: true
        }); //change name and disbale 
    }
  });
});

/*Optional*/

select.disabled {
  color: graytext;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form action="#" name="my-form">
  <select id="my-select" name="alpha">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
  </select>
</form>
<br/>
<button id="toggle">toggle enable/disable</button>