使用JavaScript的onclick在一段PHP循環

我想加上或減去1，一個簡單的量的輸入框，可以像下面的圖片不同：使用JavaScript的onclick在一段PHP循環

PHP：

$query = ... 
while ($row= mysqli_fetch_array($query)) 
{ 
    <input type="hidden" value="<?php echo $row['id']; ?>" id="id_part"> 
    <input type="text" value="<?php echo $row['quantity']; ?>" id="<?php echo $row['id']; ?>_count"><br> 
    <input type="button" value="-" id="minus" onclick="minus()"> 
    <input type="button" value="+" id="plus" onclick="plus()"> 
}

的Javascript：

<script> 
    var count = 1; 
    var id = document.getElementById("id_part").value; 
    var countEl = document.getElementById(id + "_count"); 
    function plus(){ 
     count++; 
     countEl.value = count; 
    } 
    function minus(){ 
     if (count > 1) { 
     count--; 
     countEl.value = count; 
     } 
    } 
</script>

它不起作用。它只需要我第一個ID數量框。無法管理編輯第二個數量框，其中id應該不同。正如你所看到的，我爲每個id標籤分配了不同的名字，取自數據庫id。

來源

2017-10-18 Bogdan C

您正在重新使用'id'值，這在HTML中無效。使用唯一的'id'值。 – David

爲什麼不使用輸入類型編號進行此行爲？ [（doc，滾動到輸入類型編號）]（https://www.w3schools.com/html/html_form_input_types.asp）[（example）]（https://www.w3schools.com/html/tryit.asp ？filename = tryhtml_input_number） –

我不喜歡那個輸入的方面。 –

Working fiddle。

發生這種情況是因爲您的id屬性應該是唯一的，因此您的ID有重複。

請改用普通類。

來源

2017-10-18 14:22:48

正在爲腳本中的每一行生成ID id_part。當您點擊按鈕時，它會查找id_part的實例及其第一個值並編輯其值。

使用唯一的ID說id='id_part' +<?php echo $row['id']; ?>

來源

2017-10-18 14:33:36 Tphil

其實你的隱藏字段，ID應該是唯一的，但它是在循環並返回所有行相同的值。

<input type="hidden" value="<?php echo $q; ?>" id="**id_part**"> 

Try blow changes, 
change your inner html as below 
<input type="button" value="-" id="minus" onclick="minus(<?php echo $row['id']; ?>)"> 
<input type="button" value="+" id="plus" onclick="plus(<?php echo $row['id']; ?>)"> 


<script> 
    var count = 1; 
    function plus(position){ 
     count++; 
     var countEl = document.getElementById(position + "_count"); 
     countEl.value = count; 
    } 
    function minus(position){ 
     if (count > 1) { 
     count--; 
     var countEl = document.getElementById(position + "_count"); 
     countEl.value = count; 
     } 
    } 
</script>

來源

2017-10-18 14:40:51

除了一個細節之外，我用它來解決這個問題。如果我在第一個數量框中加上1，然後在第二個數量框中加上1，則第二個框中的新值將是第一個框+1中的第一個值，而不是第二個框中的第一個值。 –

試着用靜態的id和值的小提琴，你會明白我在說什麼。 –

使用JavaScript的onclick在一段PHP循環

回答

相關問題