Question

我正在尝试根据用户选择的“性别”（即mr，mrs，ms。）来更改表单输入。如果用户选择“mr”，我想改变表格以定制他的性别的输入。要做到这一点，我需要一些问题消失。

我的JSFiddle就在这里 Jsfiddle

HTML

<select name="prefix" id="prefix">
            <option value=""></option>
            <option value="mr">Mr.</option>
            <option value="ms">Ms.</option>
            <option value="mrs">Mrs.</option>
</select> 

<div id="disappear">
</div>

JAVASCRIPT

<script>
        if($('#prefix').val("mr")){
            $("#disappear").css("display", "none");
        };
</script>

谢谢一群人，真的很感激。

Answer 1

将您的代码更改为：

$(document).ready(function () {
    $('#prefix').on("change", function () {
        if ($(this).val()=="mr") {
            $("#disappear").css("display", "none");
        };
        else{
            $("#disappear").css("display", "block");
        }
    });
})

您需要将该代码包装在change事件处理程序

中

Answer 2

你也需要一个事件处理程序，比如

$('#prefix').on('change', function() {
    $("#disappear").toggle( this.value !== 'mr' );
});

使用toggle根据值切换可见性。

FIDDLE

Answer 3

以上所有内容，这是您的working fiddle。

$('#prefix').on('change', function(){
        if($('#prefix').val("mr")){
            $("#disappear").css("display", "none");
        };
});

Answer 4

如果您试图隐藏与所选前缀无关的所有问题，那么您可以尝试这种方法。

使用每个问题的ViewCompat.setNestedScrollingEnabled(recyclerView, false);包装器的类，一个主要类将所有问题组合在一起（即div），并为每个选定选项的值的每个前缀分别使用一个类（即.question .mr .ms）。

如果您想要使用所有前缀查看问题，请忽略该问题的前缀类。
如果您想在多个（但不是全部）前缀下查看问题，可以为该问题设置多个前缀类。

选择主标签上的所有问题，然后根据已知的前缀标签过滤结果。这将排除所有前缀应该看到的所有问题。

定义一个隐藏所有问题的函数，并仅显示那些与所选选项匹配的类。

当DOM加载并为select元素的change事件创建一个事件监听器以运行此函数时运行此函数。

.mrs

var questions = $('.question').filter('.mr, .ms, .mrs');
hideAll();
$('#prefix').change(hideAll);

function hideAll() {
    questions.hide();
    questions.filter('.' + this.value).show();
}

.question { padding-top: 5px; margin-top: 5px; border-top: 1px solid #ccc; }

如果选择了某个选择选项，则将div的css更改为“Display：None”

4 个答案: