如何将元素的id从php获取到javascript

How to get the id of element from php to javascript?

本文关键字:php 获取 javascript id 元素      更新时间:2023-09-26

im试图回显一个使用javascript从php编写的变量。基本上,我有一个下拉菜单,我想做的是呼应用户选择的商品的库存数量。这是我迄今为止得到的。

<select id="selectItem" onchange="stock(this)">
    <?php
     --- connection here ----
    $itemsStock = array();
    $result = mysql_query("SELECT * FROM itemprofile");
    while($row = mysql_fetch_array($result))
        {
            $id = $row['id'];
            $stock = $row['stock'];
            echo '<option value="'.$row['productname'].'" id="'.$row['id'].'">'.$row['productname'].'</option>';
            $itemsStock[$id] = $stock;
        }
    ?>
</select>
Available stock: <div id="stockRemaining"></div>

 <script type="text/javascript">
var json_arr = <?php echo json_encode($itemsStock);?>;
var stockValues = JSON.parse(json_arr);
    function stock(sel)
    {
        var itemID = sel.value;
        console.log(itemID); // debug to see that you are getting the correct value
        document.getElementById('stockRemaining').innerHTML = stockValues[itemID];
    }
</script>

数组从php到jquery的转换很好,我试着回显它,它运行得很好,问题是stock()函数,我认为我在里面的操作上做错了什么,因为每次我从下拉菜单中单击不同的项目,它都不会显示任何内容。我是Jscript的新手,希望你们能帮我。谢谢

我使用的是addEventListener。我不知道你的select元素上的onchange事件是否正在启动。。

我修改了你的while循环(它在这个片段的HtmlComment字段中),只是为了增加声明和用法的一致性。。


代码段

(Php回波数据样本)

document.getElementById("selectItem").addEventListener("change", stock);
//var json_arr = <?php echo json_encode($itemsStock);?>;
//  you need to determine what kind of array this will actually be: i.e. sequential, non-sequential
//  reference: http://php.net/manual/en/function.json-encode.php#example-3898
//  I'm presuming it will be a non-sequential with this demo data.
var json_arr = '{ ' +
''"001'" : '"12000'",' +
''"002'" : '"7000'",' +
''"003'" : '"200'",' +
''"004'" : '"10'"' + 
'}';
  
var stockValues = JSON.parse(json_arr);
function stock(ev)
{
    var itemID = ev.target.selectedOptions.item().id;
    console.log("%o - %o", stockValues, ev.target.selectedOptions.item().id); // debug to see that you are getting the correct value
    document.getElementById('stockRemaining').innerHTML = stockValues[itemID];
}
<select id="selectItem">
    <!--
    <?php
     --- connection here ----
    $itemsStock = array();
    $result = mysql_query("SELECT * FROM itemprofile");
    while($row = mysql_fetch_array($result))
        {
            $id = $row['id'];
            $stock = $row['stock'];
            $productname = $row['productname'];
            echo '<option value="'.$productname.'" id="'.$id.'">'.$productname.'</option>';
            $itemsStock[$id] = $stock;
        }
    ?>
    -->
    <option value="coke" id="001">coke</option>
    <option value="pepsi" id="002">pepsi</option>
    <option value="sprite" id="003">sprite</option>
    <option value="drpepper" id="004">drpepper</option>
</select>
Available stock: <div id="stockRemaining"></div>

首先将选择选项更改为

<select id="selectItem" onchange="stock(this)">

现在你可以在你的股票函数中获得的价值

function stock(sel)
    {
        var itemID = sel.value;
        console.log(itemID); // debug to see that you are getting the correct value
        document.getElementById('stockRemaining').innerHTML = stockValues[itemID];
    }

您可能想要从PHP JSON 创建一个javascript数组

var json_arr = <?php echo json_encode($itemsStock);?>;
var stockValues = JSON.parse(json_arr);

现在$itemstock可以作为数组使用:

您可以使用:

document.getElementById('stockRemaining').innerHTML = stockValues[itemID];

如果可行,请告诉我。