cari

Rumah  >  Soal Jawab  >  teks badan

javascript - Bagaimana untuk mengubah suai kelas elemen selepas menetapkannya menggunakan bootstrap?

Saya menetapkan kelas elemen, dan sekarang saya mahu menukar kelas elemen melalui JavaScript saya mencuba attr jQuery untuk mengubah suai atribut kelas, tetapi ia tidak berfungsi.
html:

<nav>
    <ul class="pager" id="pageCtr">
        <li class="previous" id="prevBTN">
            <a href="#" onclick="prevPage()"><span>&larr;</span>前一页</a>
        </li>
    </ul>
</nav>

js:

$('#prevBTN').className='previous disabled';
phpcn_u1582phpcn_u15822833 hari yang lalu765

membalas semua(5)saya akan balas

  • 某草草

    某草草2017-05-18 10:49:55

    Unsur hipotesis

    <p class="className" id="idValue"></p>

    Anda boleh mengubahnya seperti ini

    var e = document.getElementById('idValue')
if (e) {
    e.className = "changedClassName"
}

    Dicuba dan diuji.

    jQuery hanya document.getElementById('idValue')改成$('#idValue') dan sudah sedia

    balas
    0
  • 黄舟

    黄舟2017-05-18 10:49:55

    HTML:

    <p id="id_test" class="old-bootstrap">

    JS:

    $('#id_test').className='new_class';

    Bukan melalui attr, tetapi melalui classNameattr，而是通过className

    PS:
    如果你想为li添加属性disabled可以这样做，不是添加class而是attr：
    $('#prevBTN').attr('disabled', true);

    去除attr：

    方案1：a标签不支持disabled属性，所以你把a标签换成button标签就可以了：http://www.w3school.com.cn/ti...
    方案2：用a标签也可以，去除它的href属性就可以实现不能点击的效果，即$('#prevBTN').removeAttr('href');
    PS: Jika anda ingin menambah atribut disabled pada li, anda boleh melakukan ini, bukannya menambah class > tetapi attr：$('#prevBTN').attr('disabled', true);

    Alih keluar attr: #🎜🎜#
    #🎜🎜##🎜🎜#Pilihan 1: #🎜🎜#Teg a tidak menyokong atribut yang dilumpuhkan, jadi anda boleh menggantikan teg dengan teg butang: http://www.w3school.com. cn/ ti...#🎜🎜##🎜🎜#Pilihan 2#🎜🎜#: Anda juga boleh menggunakan teg dan mengalih keluar atribut hrefnya untuk mencapai kesan yang tidak boleh diklik, iaitu $( '#prevBTN'). removeAttr('href');#🎜🎜##🎜🎜#Rujukan: #🎜🎜#Anda letakkan kod berikut pada ini dan jalankannya#🎜🎜##🎜🎜# 
    <!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
function test() {
    $('#id_test').removeAttr('href');
}

</script>
</head>

<body>
<nav>
    <ul class="pager" id="pageCtr">
        <li class="previous" id="prevBTN">
            <a href="#" id="id_test" onclick="prevPage()"><span>&larr;</span>前一页</a>
        </li>
    </ul>
</nav>
<button id="id_test2" onClick="test()">disable</button>
</body>
</html>

    balas
    0
  • 怪我咯

    怪我咯2017-05-18 10:49:55

    Apakah kod poster asal?
    Mengapa saya boleh menggunakan attr() terus untuk menetapkan kelas?

    Selain itu, jQuery juga mempunyai dua kaedah: addClass() dan removeClass Saya biasanya menggunakan dua kaedah ini untuk mengendalikan kelas.

    balas
    0
  • 黄舟

    黄舟2017-05-18 10:49:55

    jQuery mempunyai kaedah khas untuk kelas pengendalian, anda boleh menyemak API yang berkaitan

    balas
    0
  • 淡淡烟草味

    淡淡烟草味2017-05-18 10:49:55

    Terima kasih kepada @daryl dan @tony_yin atas jawapan mereka yang bersemangat, saya mahu menggunakannya sendiri. dengan <butang> boleh mencapai kesan melumpuhkan butang, tetapi gaya lalai BootStrap .pager akan berubah
    ubah <li class= "previous" id=' prevBTN'> Gantikan dengan <li class="previous disabled" id='prevBTN'> Gunakan document.getElementById('prevBTN' ).className='previous disabled'; sememangnya boleh dilaksanakan, tetapi akan ada masalah apabila menggunakan jQuery $('prevBTN').className='previous disabled'; tidak boleh dilaksanakan. . Sebab utama ialah $ ('prevBTN') tidak boleh mendapatkan elemen DOM dan className ialah atribut dalam DOM $(selector) hanya boleh mendapatkan set Elemen DOM yang memenuhi syarat pemilih, <li> 标签里面的 <a> 换成 <button> ,能实现禁用按钮效果，但是 .pager 的 BootStrap 默认样式会变化；
    将<li class="previous" id='prevBTN'> 换成 <li class="previous disabled" id='prevBTN'> 使用 document.getElementById('prevBTN').className='previous disabled'; 确实可行，但使用 jQuery 时会出现问题，$('prevBTN').className='previous disabled'; 就不能实现，主要原因是 $('prevBTN') 并不能得到 DOM 元素，而 className 是 DOM 里面的属性，$(selector) 只能得到满足选择器条件 DOM 元素集合，

    jQuery() (or $()) with an id selector as its argument will return a jQuery object containing a collection of either zero or one DOM element.

    解决方法：$('prevBTN').get(0).className='previous disabled';

    jQuery() (atau $()) dengan pemilih id kerana hujahnya akan mengembalikan objek jQuery yang mengandungi koleksi sama ada sifar atau satu elemen DOM.#🎜🎜#
    #🎜🎜#Penyelesaian: $('prevBTN').get(0).className='previous disabled';#🎜🎜#

    balas
    0
  • Batalbalas