Question

这是应该发生的事情：如果值为＆＃39; NL＆＃39;选择字段＆＃39; place＆＃39;和＆＃39;街道＆＃39;没有必要。应该隐藏它。当价值＆＃39; BE＆＃39;如果被选中，它应该显示“地点”。和＆＃39;街道＆＃39;字段/行（带有for-be类）。默认情况下，它应该被隐藏，因为＆＃39; NL＆＃39;默认选中。

app.service('configService', ['$http', function ($http) {
    var self = this;

    this.isLoggedIn = function () {
        return $http.get('/internalAPI.php?fn=login');
    }
}]);

app.service('navigationService', ['$rootScope', '$location', '$timeout', 'configService', function ($rootScope, $location, $timeout, configService) {

    var self = this;

    $rootScope.$on('$routeChangeStart', function (event, next, current) {
        configService.isLoggedIn().then(function(result) {
            if (result !== true) {
                // no logged in user, redirect to /login
                if (next.templateUrl != "resources/views/login.php") {
                    $location.path("/login");
                    $rootScope.subTitle = 'Login';
                }
            //user is logged in but is trying to view the login page, redirect
            } else if (next.templateUrl == 'resources/views/login.php') {
                $location.path('/');
            }
        }
    }
}

jQuery中的代码我有：

<table>
<tbody>
<tr>
    <td>
        <label>Country: </label>
    </td>
    <td>
        <select name="country" id="Select">
            <option value="NL">Netherlands</option>
            <option value="BE">Belgium</option>
        </select>
    </td>
</tr>
<tr>
    <td><label>Zipcode: </label></td>
    <td><input type="text" name="zipcode" maxlength="6"></td>
</tr>
<tr class="for-be">
    <td><label>Place: </label></td>
    <td><input type="text" name="place" maxlength="60"></td>
</tr>
<tr class="for-be">
    <td><label>Street: </label></td>
    <td><input type="text" name="street" maxlength="60"></td>
</tr>
<tr>
    <td><label>Number: </label></td>
    <td><input type="text" name="number" maxlength="5"></td>
</tr>
</tbody>
</table>

~~它没有这种方式。~~ 编辑：它以这种方式工作（添加了缺失的＆＃39;）;＆＃39;）

Answer 1

http://codepen.io/anon/pen/JGzEKJ

select.change(function(){
  var selectedV = $('option:selected',this).attr('value');
  if(selectedV == 'BE'){
    $('.for-be').hide();
  }else {
    $('.for-be').show();
  }
});

Answer 2

试着实现简单的逻辑。

HTML：

<table>
<tbody>
<tr><td><label>Country: </label></td><td><select name="country" id="Select"><option value="NL">Netherlands</option><option value="BE">Belgium</option></select></td></tr>
<tr><td><label>Zipcode: </label></td><td><input type="text" name="zipcode" maxlength="6"></td></tr>
<tr class="BE all_value"><td><label>Place: </label></td><td><input type="text" name="place" maxlength="60"></td></tr>
<tr class="BE all_value"><td><label>Street: </label></td><td><input type="text" name="street" maxlength="60"></td></tr>
<tr><td><label>Number: </label></td><td><input type="text" name="number" maxlength="5"></td></tr>


</tbody>
</table>

Jquery的

$(document).ready(function(){
    var select = $('#Select');

    select.change(function(){
     $(".all_value").hide();
     $("."+select.val()).show();
    }
});

Answer 3

尝试select.on（）。这是一个工作小提琴

https://jsfiddle.net/57gok7c9/

select.on('change',function(){

    if(select.val() == 'NL'){
        $('.for-be').hide();
    } else if(select.val() == 'BE'){
        $('.for-be').show();
    }
});

编辑 - 正如satpal指出的那样，代码中存在一个简单的语法错误。

Answer 4

试试这个

$('#Select').change(function () {

var textVal= $(this).val();

if (textVal== 'NE') {
     $('.for-be').hide();
}
else if(textVal=='BE') {
     $('.for-be').show();
}
});

我可以根据所选值显示/隐藏元素吗？

4 个答案: