Question

我需要禁用/隐藏选择列表中的选项。但是，这个选择列表不在我的代码中，是电子商务平台的模式。

我们用JS更改代码，请按照：

    /*var buttons = "";
$("select option").each(function () {
buttons += "<input type='button' value='" + this.value + "'/>";    
});

$("select").replaceWith(buttons);
*/

var selectName = $('select').attr('name');

// add a hidden element with the same name as the select
var hidden = $('<input type="hidden" name="'+selectName+'">');
hidden.val($('select').val());
hidden.insertAfter($('select'));

$("select option").unwrap().each(function() {
var btn = $('<div class="btn">'+$(this).text()+'</div>');
if($(this).is(':checked')) btn.addClass('on');
$(this).replaceWith(btn);
});

HTML + CSS EMBED：

<!-- Variações -->
<iluria.if.product.has.variations>
<div class="product-variations-container">
$iluria.product.variations
</div>                              
<script src="variations.js"></script>
<style>
div.btn {display: inline-block;border: 2px solid #ccc;margin-right: 5px;padding: 2px 5px;cursor: pointer;}
div.btn.on {background-color: #777;color: white;}
</style>
</iluria.if.product.has.variations>

    $(document).on('click', '.btn', function() {
    $('.btn').removeClass('on');
    $(this).addClass('on');
    $('input[name="'+selectName+'"]').val($(this).text());
    });

屏幕：

https://i.stack.imgur.com/gz8NU.jpg

我需要隐藏/禁用选项 TAMANHO

感谢！

Answer 1

您可以使用JQuery来显示和隐藏：

ex：$（＆＃39;输入[name =＆＃34;＆＃39; + selectName +＆＃39;＆＃34;]＆＃39;）。hide（）;

$('input[name="'+selectName+'"]').show();

使用JS或CSS禁用/隐藏选项

1 个答案: