laravel中省市区的三级联动

最新推荐文章于 2024-09-11 10:02:59 发布

weixin_30642267

最新推荐文章于 2024-09-11 10:02:59 发布

阅读量780

点赞数

文章标签： php 数据库 javascript ViewUI

原文链接：http://www.cnblogs.com/a-record/p/8317476.html

版权

html:

  <div>
      <div class="col-md-2">
          <select class="form-control" id="s1" name="one">
              <option value="">请选择所在省</option>
              @foreach(\App\Lib\Position::getPositionType() as $k=>$v)
                  <option value="{{$k}}">{{$v}}</option>
              @endforeach
          </select>
      </div>
      <div class="col-md-2">
          <select class="form-control" name="two" id="s2">
              <option value="">请选择所在城市</option>
              @foreach($positionType as $v)
                  @if($v->pid == 0)
                      <option class="s2_type s1_{{$v->tid}}" value="{{$v->id}}">{{$v->name}}</option>
                  @endif
              @endforeach
          </select>
      </div>

      <div class="col-md-2">
          <select class="form-control" name="type_id" id="s3">
              <option value="">请选择所在区域</option>
              @foreach($positionType as $v)
                  @if($v->pid > 0)
                      <option class="s3_type s2_{{$v->pid}}" value="{{$v->id}}">{{$v->name}}</option>
                  @endif
              @endforeach
          </select>
      </div>
  </div>


javascript:

//三级联动
$("#s1").change(function(){

    $(".s2_type").hide();
    $(".s3_type").hide();
    var id = $(this).val();
    $(".s1_"+id).show();
    console.log(".s1_"+id)
});

$("#s2").change(function(){
    $(".s3_type").hide();
    var id = $(this).val();
    $(".s2_"+id).show();
    console.log(id)
});