Jquery单选按钮值不变

Question

需要一些帮助，我搜索了谷歌但没有运气。

我正在尝试更新我的收音机按钮在 div 类“size-number”中的值。我想在下面的 ajax 请求中使用该值。当我检查元素时，单选按钮具有可用按钮的更新值但是当我在 jquery 中 console.log 时，它给了我相同的初始值，尽管我选择了。我尝试将单选按钮设置为 checked="checked"。我也相信这是默认值的问题。我还尝试了 jquery 中的输入验证。此外，我还尝试在 jquery 中引用输入（“input[name='radiobten']:checked”）。任何建议将不胜感激！

$(".size-number").click(function(){

  

  var modelid = $("#modelval").attr('value');

  console.log(modelid);

 

  $.ajax({

    url: '"Example API"',

    data:  [],

    dataType: 'json',

    type: "GET",

    success: function(res){

      var newarr = (res).filter(function(indx){

        return indx.model_cat_id == modelid

      });

      console.log(newarr)

      $('modelselect').slideToggle(200).html(res);

    }});

});

<?php foreach ($brands as $brand){ ?>

    <div class="search-select">

        <i class="fas fa-chevron-down"></i>

        <a href="/<?php echo $brand->full_slug.$urlSize; ?>">

        

        <?php echo $brand->name; ?></a>

        

    </div>

    <?php

        $slugCurrent = $brand->slug;

        foreach ($models as $model){

            if($model->brand_id == $brand->id){

            if(is_null($model->model_cat_id)){?>

                <div class="size-number" style="display: none;">

                    <a href="/<?php echo $brand->slug; ?>/<?php echo $model->slug_full.$urlSize; ?>" style="color: blue;"><?php echo $model->name; ?><input type="radio" id="modelval" name="radiobten" value="<?php echo $model->id?>"/></a>

                </div>

                <?php    

            }

                

            }

        }

    }?>

Answer 1

您不能有多个具有相同 ID 的元素，即 : modelval。无论您选择哪个按钮，这将始终为您提供第一个单选按钮的值。而不是用于class获取单选按钮的值。因此，您可以使用 div 的 onclick$(this).find("yourclassname").attr('value')来获取该特定按钮的值。演示代码：$(".size-number").click(function() {&nbsp; //div->find closest modelval->value&nbsp; var modelid = $(this).find(".modelval").attr('value');&nbsp; console.log(modelid);&nbsp; $.ajax({&nbsp; &nbsp; url: '"Example API"',&nbsp; &nbsp; data: [],&nbsp; &nbsp; dataType: 'json',&nbsp; &nbsp; type: "GET",&nbsp; &nbsp; success: function(res) {&nbsp; &nbsp; &nbsp; var newarr = (res).filter(function(indx) {&nbsp; &nbsp; &nbsp; &nbsp; return indx.model_cat_id == modelid&nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; console.log(newarr)&nbsp; &nbsp; &nbsp; $('modelselect').slideToggle(200).html(res);&nbsp; &nbsp; }&nbsp; });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div class="size-number" >&nbsp; <a href="/<?php echo $brand->slug; ?>/<?php echo $model->slug_full.$urlSize; ?>" style="color: blue;">Abc<input type="radio" class="modelval" name="radiobten" value="1"/></a></div><div class="size-number" >&nbsp; <a href="/<?php echo $brand->slug; ?>/<?php echo $model->slug_full.$urlSize; ?>" style="color: blue;">Xyz<input type="radio" class="modelval" name="radiobten" value="2"/></a></div>&nbsp;