Question

我进行了搜索和搜索但是我的jquery / js技能非常差，我无法让它工作。

我想要的是选择中的每个选项都会显示不同的信息以供参考。

<label class="checklabel">Is it possible to recieve mail?</label>
<select class="mailoption">
    <option value="1">Yes</option>
    <option value="2">No</option>
</select>

<div class="yesmail">Yes can recieve mail.</div>
<div class="nomail">No can't recieve mail.</div>

当值为1时，它应显示“yesmail”，选项2应显示“nomail”。我已经尝试过从stackoverflow收集的几行编码，但我都必须调整它，这是我在这个程度上做不到的。

有人可以帮助我吗？

谢谢，

Answer 1

我猜你在选择DOM元素方面遇到了问题。正如@Teemu指出的那样，你可能想要使用id。您可以使用$(".foobar")选择class foobar和$("#foobar")的元素，以选择id foobar元素。

$(document).ready(function() {
    $(".mailoption").change(function() {
        if($(this).val() == 1) {
            $(".yesmail").removeClass('hidden');
            $(".nomail").addClass('hidden');
        } else {
            $(".yesmail").addClass('hidden');
            $(".nomail").removeClass('hidden');
        }
    });
});

.hidden {
    display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="checklabel">Is it possible to recieve mail?</label>
<select class="mailoption">
    <option value="1">Yes</option>
    <option value="2">No</option>
</select>

<div class="yesmail">Yes can recieve mail.</div>
<div class="nomail hidden">No can't recieve mail.</div>

Jquery - <select>更改</select>上的显示元素

1 个答案: