Question

我有一些代码用于在某些情况下隐藏文本输入字段和下拉菜单，并且所有代码在普通浏览器上都可正常工作，即标签名称和字段根据需要隐藏。这是我的代码段：

function ShowHideLabels(val) {
if (val == 'show') {
    $('#card-holder').hide().attr('disabled', 'disabled');;
    $('#card-type').hide().attr('disabled', 'disabled');;
    $('#card-number').hide().attr('disabled', 'disabled');; 
    $('#card-expiry-month').hide().attr('disabled', 'disabled');;
    $('#card-expiry-year').hide().attr('disabled', 'disabled');; 
    $('#card-start-month').hide().attr('disabled', 'disabled');; 
    $('#card-start-year').hide().attr('disabled', 'disabled');;
    $('#card-issue-number').hide().attr('disabled', 'disabled');;
    $('#register-token').hide().attr('disabled', 'disabled');;
    $('div.ccinfo').find('label').each(function() {
        if ($(this).html()== '$card_holder' || $(this).html()=='$card_type' || $(this).html()=='$card_number' || $(this).html()=='$card_cv2_not_present' || $(this).html()=='$card_expiry_date' || $(this).html()=='$card_issue_number' || $(this).html()=='$card_start_number' || $('.tokenTooltip' , this).length) {
            $(this).addClass('CardsDisabledLabel');
            $(this).prev('br').addClass('CardsDisabledLabel');
        }
    });
} else {
    $('#card-holder').removeAttr('disabled').show();
    $('#card-type').removeAttr('disabled').show();
    $('#card-number').removeAttr('disabled').show();
    $('#card-expiry-month').removeAttr('disabled').show();
    $('#card-expiry-year').removeAttr('disabled').show();
    $('#card-start-month').removeAttr('disabled').show();
    $('#card-start-year').removeAttr('disabled').show();
    $('#card-issue-number').removeAttr('disabled').show();
    $('#register-token').removeAttr('disabled').show();
    $('.CardsDisabledLabel').removeClass('CardsDisabledLabel');
}

} }）;

使用基于jQuery-mobile的移动模板查看网站时会出现问题。

标签被隐藏，文本输入字段也被隐藏，但是下拉列表仍然可见，只是显示为灰色，因此它们不起作用。

我假设这是因为当通过移动设备观看时，下拉菜单被赋予了一类“ui-select”，因为如果我暂时向该课程添加display：none，它们就会消失。我已经尝试过编辑显示/隐藏代码，但也没有编辑“ui-select”类。我正在寻找将“selectHide”这样的内容添加到“ui-select”类中但我无法使其工作。

你能否就如何在jQuery-mobile下显示停止下载提出任何建议或指示？

Answer 1

当jQuery Mobile增强了选择菜单时，会添加<div>（以及其他内容）。您必须将该元素作为目标，以隐藏选择。

为此，只需将-button附加到选择器（tested on jQM 1.4.2）中您的选择的ID：

$("#my_select_id-button").hide();

...我还建议您使用ShowHideLabels函数：不要单独引用每个元素来显示/隐藏它们，这是一种容易出错的方法。为每个元素添加一个公共类（cardElement），并使用jQuery选择器：$(".cardElement").hide();

使用jQuery-mobile时，显示灰色而不是隐藏

1 个答案: