【问题标题】:jquery - show and hide DIV with the select tagjquery - 使用选择标签显示和隐藏 DIV
【发布时间】:2014-02-14 21:24:49
【问题描述】:
<label for="continent">Select Continent</label>
<select id="continent" onchange="countryChange(this );">
    <option value="empty">Select a Continent</option>
    <option value="North America">North America</option>
    <option value="South America">South America</option>
    <option value="Asia">Asia</option>
    <option value="Europe">Europe</option>
    <option value="Africa">Africa</option>
</select>
<br/>
<label for="country">Select a country</label>
<select id="country">
    <option value="0">Select a country</option>
</select>
<div id="soc-pri">
    <label for="company">Company</label>
    <input name="customer" type="radio" value="company" />
    <label for="private">Private</label>
    <input name="customer" type="radio" value="private" />
</div>
<div id="lib-ass">
    <label for="individual firm / freelancer">Individual Firm / Freelancer Professionista</label>
    <input name="customer" type="radio" value="privato" />
    <label for="association">Associazione</label>
    <input name="customer" type="radio" value="association" />
</div>




$(document).ready(function () {
    $("select").change(function () {
        if ($("select option:selected").val() == "Europe") {
            $('#lib-ass').show();
            $('#soc-pri').show();

        } else if ($("select option:selected").val() != "Europe") {
            $('#lib-ass').hide();
        }
    }).change();
});

大家好,我刚开始学习jquery。 我有两个包含大陆和国家的选择字段。

我需要 nascodere 显示两个 DIV,“lib-ass”和“soc-first”:

1) 当您选择欧洲大陆时,会出现 DIV“lib-ass”。 没关系

2) 当你没有选择欧洲大陆 DIV “lib-ass”时,隐藏。 没关系

3 当您不选择国家 DIV British 时,“lib-ass”必须隐藏。 这样不行

当您选择国家 DIV British 时,您必须显示“lib-ass”。 这样不行

我的问题是我不能隐藏显示,当你选择你的国家英国时,ID为“lib-ass”的DIV标签。

我哪里错了?

我希望 averdato 提供尽可能多的信息。 谢谢

http://jsfiddle.net/carmy/jg7Ls/6/

【问题讨论】:

  • My needs nascodere 是什么意思?
  • 你要this
  • 抱歉英语不好
  • 我想写hide,对不起
  • @Satpal 是我设法做到的

标签: javascript jquery html select show-hide


【解决方案1】:

http://jsfiddle.net/J2XDk/1/这是你想要做的吗?

我做了一些更改:select 值可以通过直接在 select 上调用 .val() 来检索(无需查找选定的选项)。我还专门使用选择框 ID 查找它,因为只是做 $('select') 是模棱两可的。将值保存到变量中,这样您就不必多次执行 jQuery。欧洲检查的替代条件可以使用else,不需要专门检查!= "Europe"

$(document).ready(function () {

    $("select").change(function () {
        var continent = $('#continent').val(),
            country = $('#country').val(),
            $libass = $('#lib-ass'),
            $socpri = $('#soc-pri');

        if (continent === "Europe") {
            $libass.show();
            $socpri.show();

        } else {
            $libass.hide();
        }

        if(country === 'Britain') {
            $libass.hide();                
        } else {
            $libass.show();   
        }

    }).change();
});

【讨论】:

  • 这正是我想要实现的。非常感谢。
【解决方案2】:

您可以在逻辑中添加以下内容:

$("#country").change(function(){
            if($("#country option:selected").val() == "Britain") {
                $('#lib-ass').show(); 
                $('#soc-pri').show();
            }else{
                $('#lib-ass').hide();
            }
 }).change();

其中国家是您选择的国家的选择框。井号 (#) 用于在 Jquery 中调用特定 ID。

Here is a working example

【讨论】:

  • 好的,非常感谢。
  • 不知道,刚加入,不好意思
  • 别担心!当您认为它符合您的要求时,您可以接受它。
猜你喜欢
  • 1970-01-01
  • 2010-11-27
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-11-06
  • 1970-01-01
相关资源
最近更新 更多