Question

为什么

我想在html标记中获取值，但是它只返回第一个值，我不知道为什么...（我想要带有“ iHidden”类的html标记值）

（我在我的JavaScript中完全设法获得了名称为“ service []”的第一个输入的值）

while($service = $req->fetch()){ ?>

            <div class="form-control">
              <input type="checkbox" name="service[]" value="<?= $service['price']; ?>" id="<?= $i++ ?>">
              <p>id_service : <i class="iHidden"><?= $service['id_service']; ?></i></p>


              <label for="<?= $service['service'] ?>"><?= $service['service']; ?></label>
              <strong><?= $service['price']; ?>€</strong>
            </div>

    <?php } ?>

这是我的javascript：

for(var i = 0; i <= totalService; i++){

    if($('#'+i).is(":checked")){

        // For the first input (it works)

        var total = $('#'+i).val();

        globalTotal = parseInt(globalTotal )+ parseInt(total); 

        // End for the first input



        // Here is the problem : it returns only the first value in my database...
        getI[i] = $('.iHidden').html();

        console.log(getI); // shows the first value


    }
}

当它单击“ Calculer prix des services”时，我希望它向我显示我检查的服务的ID。如果我选中了2，我希望它向我显示2。

提前感谢您的帮助！

Answer 1

html()方法返回集合中第一个元素的HTML内容。对于您来说，.iHidden选择类为iHidden的所有元素。

From docs:

获取匹配元素集中的 第一个元素 的HTML内容，或设置每个匹配元素的HTML内容。

要解决此问题，请基于total元素的父元素进行选择。其中closest()方法可用于获取共同祖先，并使用find()方法获取iHidden元素。

getI[i] = $('#'+i).closest('.form-control').find('.iHidden').html();

仅供参考： From MDN docs:

注意：使用除ASCII字母，数字，“ _”，“-”和“。”以外的字符。可能会导致兼容性问题，这是HTML 4所不允许的。尽管在HTML 5中取消了此限制，但ID应当以字母开头以确保兼容性。

因此，最好以字母而不是数字开头ID值。

例如：

PHP

<input type="checkbox" name="service[]" value="<?= $service['price']; ?>" id="total<?= $i++ ?>">

JS

for (var i = 0; i <= totalService; i++) {
  var $tot = $('#total' + i);
  if ($tot.is(":checked")) {
    var total = $tot.val();
    globalTotal = parseInt(globalTotal) + parseInt(total);
    getI[i] = $tot.closest('.form-control').find('.iHidden').html();
    console.log(getI);
  }
}

为什么在我已经打印了数组的所有值的情况下只返回数组的第一个元素？

1 个答案: