首页 > 解决方案 > ajax,当它具有不同的值时,我得到相同的值

问题描述

我点击了不同的值,但 console.log 给了我相同的值。 在此处输入图像描述

我也会value attribute选择具有不同值的 html 代码,但是它给了我属性的第一个值。 在此处输入图像描述

实际上,ajax 有 2 个选项。这就是我累了。

<script type="text/javascript">

    $(function(){
        $('.categoryList').click(function(){
          
          var cat_id = $(this).attr('value');
          var url = "http://localhost:8000/api/getSubcategory/"+cat_id;
          $.ajax({
              type: "GET",
              url: url,
              dataType: "JSON",
              success: function(res)
              {
                var html = "";
                $.each(res, function (key, value) {
                     html += "<option  value="+key+">"+value+" </option>";
                });
                 $('#subcategory').html($(html).addClass('subcategoryList'));

              }
          });
        });

    });
$(document).ready(function() {
    $('#subcategory').click(function() {

       var  subcat_id = $( this ).find( '.subcategoryList' ).attr('value');
          console.log(subcat_id);
          var url = "/api/getSubcategorytwo/"+subcat_id;
          $.ajax({
              type: "GET",
              url: url,
              dataType: "JSON",
              success: function(res)
              {
                
                var html = "";
                $.each(res, function (key, value) {
                     html += "<option value="+key+">"+value+"</option>";
                });
                $("#subcategorytwo").html(html);

              }
          });
        });

    });
</script>
                   <div class="col-md-4" >
              
                        @foreach($categories as $category)
                        <option  class="categoryList" value="{{$category->id}}">{{$category->category}}</option>
                        @endforeach
                    
                    </div>
                 
                        <div class="col-md-4 ">
                        <a  name="subcategory" id="subcategory" >
                         </a>
                        </div>
                  
                       <div class="col-md-4">
                        <a name="subcategorytwo" id="subcategorytwo" >
                          <option value=""></option>
                        </a>
                        </div>
           

enter code here

标签: javascriptajax

解决方案


指定的html代码都是错误的。您可以使用<a />锚标签或<select><option></option> </select>选择标签。

如果您更喜欢anchor标签,那么您可以获得点击功能,但在 html 中,您最终会得到一长串锚点

如果您选择select标签,那么您可以调用 on change 事件并获取所选值。您可以使用以下任何一种

关于更改功能

使用 jquery 更改事件处理程序


推荐阅读