>  Q&A  >  본문

angular.js - 求一个angularJS写法


A是下拉列表 BC是文本框。
默认C文本框是隐藏。B文本框可用 。
要实现当A下拉选择最后一个元素,B禁用同时C显示。
A不选择最后一个元素,恢复原样。

            <fieldset>
            <legend>Household Income Survey</legend>

            <p class="row">
                <p class="form-group col-xs-12 col-sm-6">
                    <label for="HouseholdSize" class="control-label">I. How many people live in your home?</label>
                    <select class="form-control" name="HouseholdSize" id="HouseholdSize">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="8+">8+</option>
                    </select>
                </p>
                <p class="form-group col-xs-12 col-sm-6">
                    <label for="HouseholdIncome" class="control-label">II. Household Annual Income</label>
                    <select class="form-control" name="HouseholdIncome" id="HouseholdIncome">
                        <option value=""></option>
                        <option value="15171">15171</option>
                        <option value="21590">21590</option>
                        <option value="29101">29101</option>
                        <option value="36612">36612</option>
                        <option value="44123">44123</option>
                        <option value="51634">51634</option>
                        <option value="59145">59145</option>
                        <option value="66656">66656</option>
                        <option value="74167">74167</option>
                    </select>
                </p>
            </p>

            <p class="form-group hidden" id="HouseholdIncomeGroup">
                <label class="control-label" for="HouseholdIncome">III. If there are more than 8 people living at your
                    home, please write the annual household income here</label>

                <p class="input-group">
                    <p class="input-group-addon">$</p>
                    <input type="text" class="form-control" name="" placeholder="">
                </p>
            </p>
        </fieldset>
仅有的幸福仅有的幸福2692일 전664

모든 응답(3)나는 대답할 것이다

  • 为情所困

    为情所困2017-05-15 16:53:15

    html 코드:

    으아아아

    자바스크립트 코드:

    으아아아

    회신하다
    0
  • 阿神

    阿神2017-05-15 16:53:15

    @nightire와 동일한 아이디어, 코드 부분은 여기에 게시됩니다:

    으아악

    아마 이럴 겁니다.

    회신하다
    0
  • 阿神

    阿神2017-05-15 16:53:15

    <select> 填充好,然后 ng-model 绑定作用域里一个属性,然后 $watch 这个属性,当条件满足时改变一个状态属性(预先定义好),最后将这个状态属性双向绑定给 B 的 ng-disabled 和 C 的 ng-show/ng-if 바로 그거예요.

    회신하다
    0
  • 취소회신하다